Geek Answers Handbook

Form element doesn't match CSS vertical alignment in Opera

I pasted the Google Custom Search Engine form inside the navigation bar, but I just can't get its center alignment in Opera. All browsers adhere to vertical alignment (yes! Even IE .. wow!).

You can check it at www.micod.cat (the site is not in English, but you can easily view the search box in the menu bar, correctly). Opera pushes the form input field to the top and incorrectly.

Here is the CSS for this element:

#menu li.find form div {
   padding: 0;
   margin: 0;
   height: 50px;
   line-height: 50px;
   vertical-align: middle;
}

Any bright minds to offer some insight please? Many thanks!

+5
source share
3 answers

, , , &nbsp; <input type="q" .. /> .

, , , .

+1

, Doctype, HTML-, , .

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

Doctype XHTML , Opera " ", , , , - Opera Doctype

+3

This is not the content you want to align, but the image inside the content.

#menu li.find form div img{ vertical-align: middle; }

and looking at your site, you will need:

#menu ul.nav li.find { padding-top: 10px; }
0
source

More articles:


All Articles