Change Details

# Visit http://livingstyleguide.wmflabs.org/ in Firefox # Click in the search area, and type "Hello" Result: You see nothing. After a delay the search suggestions dropdown appears, but you never see what you typed. Workaround: press [Enter] to go to the Special:Search page This screenshot shows the problem: {F183281} (The screenshot shows a separate bug {T103730}.) The problem is Blueprint's master.css specifies huge top and bottom padding for the search input field that make it 0 pixels tall: ``` .navbar.navbar-fixed-top .search-input { ... padding: 25px 40px; height: 30px; } ``` Firefox obeys and squeezes the input field out of existence. Chromium also thinks `$('#searchInput').height()` is 0, but shows what you type anyway.

# Visit http://livingstyleguide.wmflabs.org/ in Firefox # Click in the search area, and type "Hello" Result: You see nothing. After a delay the search suggestions dropdown appears, but you never see what you typed. Workaround: press [Enter] to go to the Special:Search page This screenshot shows the problem: {F183281} (The screenshot also shows a separate bug {T103730}.) The problem is Blueprint's master.css specifies huge top and bottom padding for the search input field that make it 0 pixels tall: ``` .navbar.navbar-fixed-top .search-input { ... padding: 25px 40px; height: 30px; } ``` Firefox obeys and squeezes the input field out of existence. Chromium also thinks `$('#searchInput').height()` is 0, but shows what you type anyway.

# Visit http://livingstyleguide.wmflabs.org/ in Firefox # Click in the search area, and type "Hello" Result: You see nothing. After a delay the search suggestions dropdown appears, but you never see what you typed. Workaround: press [Enter] to go to the Special:Search page This screenshot shows the problem: {F183281} (The screenshot also shows a separate bug {T103730}.) The problem is Blueprint's master.css specifies huge top and bottom padding for the search input field that make it 0 pixels tall: ``` .navbar.navbar-fixed-top .search-input { ... padding: 25px 40px; height: 30px; } ``` Firefox obeys and squeezes the input field out of existence. Chromium also thinks `$('#searchInput').height()` is 0, but shows what you type anyway.