Please see patch at https://github.com/isapir/tomcat-site/commit/5e4d642 which adjusts the search box alignment and adds a keyboard toggle with the Enter key when the hamburger menu icon has focus.
Best, Igal On Thu, Jan 25, 2018 at 1:34 PM, Igal @ Lucee.org <i...@lucee.org> wrote: > On 1/25/2018 1:04 PM, Konstantin Kolinko wrote: > >> 2018-01-25 20:06 GMT+03:00 Igal @ Lucee.org <i...@lucee.org>: >> >>> Thank you for sharing your screenshots. I am not sure why that happened >>> but >>> I will fix it. >>> >>> The first thing that comes to mind is a cached CSS file, so I will rename >>> the file to make sure that that's not a factor. It's a bit challenging >>> that >>> I can't reproduce it on my system, but I will check on my Fedora laptop >>> too. >>> >> That Firefox is run with a separate profile that I use for testing - >> it has caching disabled. >> >> Comparing eu/us mirrors, both are the same, >> http://tomcat.eu.apache.org/ >> http://tomcat.us.apache.org/ >> >> What happens when you zoom out? >> >> Looking for active css rules on the input element, >> >> .searchbox input[type="search"], .searchbox button { >> height: 25px; >> } >> >> Why a "type" selector is here? Can it be more simple? >> It can be just #query, as this input has an id. >> > Styling by ID instead of a class has other implications, primarily > specificity [1], which makes projects styling harder to maintain. I am > unaware of any browser that has issue with that selector. If there is then > I can modify it. > > Why the height is in pixels, not in font units? >> >> There is a css rule for height (quoted above), but there is no rule >> for width of this input field. >> (When size attribute not specified it should default to size="20", and >> width depends on the actual font). >> > The width here came from the parent container. I was unaware of any > issues as all 4 browsers (Chrome, Firefox, Edge, IE11) that I tested on > rendered it correctly in my testing. > > I will fix the known issues and submit a new patch. > > Thank you, > > > Igal > > [1] https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity >