Webmaster Forum / HTML, CSS, Scripts / CSS / August 2005

I am trying to build a header to each page:

<div class='header'>
<h5>HEADER</h5>
<span><select><option>Drop Down Nav</option></select><submit></span>
</div>

It looks good in IE but is messed up in firefox. The Header is white but
it is not showing up on the blue box. Also the submit button does not
line up with the drop down box very well in firefox (but again is fine
in IE). Here is what I am using:

This is suppose to create a blue box with a grey background

form div.header {
  width: 100%;
  border: 2px solid #999999;
  background-color: #003366;
}

The drop down nav is on the right side of the box

form div.header span {
   float: right;
   padding: .7% 2px 0px 0px;
   font-size: 80%;
}

The button to click next to the drop down menu

form div.header input.navSubmit {
   padding: .7% 2px 0px 0px;
   font-size: 82%;
   font-weight: bold;
  width: auto;
  padding: 0px;
  margin: 0px 2px;
  background-color: #cccccc;
  color: #000000;
}

The header

h5 {
  font-family: arial, verdana, sans-serif;
  font-size: 140%;
  font-weight: bold;
  color: #FFFFFF;
  margin: 0px;
  padding: 4px 4px;
  letter-spacing: 4px;
  float: left;
}

Any help in cleaning this up would be appreciated.

- CSS NEWBIE