title: CSS issues with menu
body: <p>I had a working menu on my site but when I moved it from one webhost to another it got a bit broken and I am not sure why as I haven't changed any files.</p>
  
  <p>It looks like in the image below and naturally I want the blog item (and other items) to be aligned to the left and not have that grey box which is 2px something higher.
  <a href="http://img600.imageshack.us/img600/2066/61967761.png" rel="nofollow">http://img600.imageshack.us/img600/2066/61967761.png</a></p>
  
  <p>My CSS is:</p>
  
  <pre><code>#header {
      display:block;
      overflow:hidden;
      width:960px;
      height:174px;
      background:url(../App_Themes/logo01.png) no-repeat -2px 14px;
  }
  
  #header ul {
      display:block;
      overflow:hidden;
      float:right;
      height:38px;
      margin-top: 0px;
  }
  
  #header ul li {
      display:block;
      overflow:hidden;
      float:left;
      margin-left:2px;
  }
  
  
  
  #header li ul{
      background: rgb(211,211,211);
          display:none;
          height:auto;
          position:absolute;
          width:180px;
      z-index:200;
      margin-left: 9px;               
  }
  
  #header li li {
      display:block;
          float:left;
      padding: 0px;
      width:180px;
      margin-left: 0px;
      border-bottom: 1px solid;
      border-color: #fff;
      height: 25px;
  }
  
  #header li:hover ul{
          display:block;
  }   
  
  #header li ul li a {background-image: none; 
              color:#000;
              text-indent: 0px;
              font-family: Tahoma;
              font-size: 12px;
                      width: 180px;
              padding-top: 5px;
              padding-left: 5px;
  text-decoration: none;
  }
  
  #header li ul li a:hover {background-image: none;   
              background: rgb(26,66,126); 
              color:#fff;
  }
  
  #header .tagline {
      display:block;
      overflow:hidden;
      float:right;
      margin-top:40px;
      width:620px;
  }
  </code></pre>
  
  <p>HTML example:</p>
  
  <pre><code>&lt;div id="header"&gt;
  &lt;ul id="menuElem"&gt;
  &lt;li class="menublog"&gt;
  &lt;a href="... /&gt;
  &lt;/li&gt;
  &lt;li class="menuabout"&gt;
  &lt;a href="... /&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What could be the issue here?</p>