title: Dropdown Menu not displaying properly in ie7 or ie8
body: <p>I am currently working on a project and I am having problems with the dropdown menu and how it is displaying in ie7 and ie8.</p>
  
  <p>You can view it here:</p>
  
  <p><a href="http://getsmarta.co/_cms/topflight/" rel="nofollow">http://getsmarta.co/_cms/topflight/</a></p>
  
  <p>Here is the css I am using:</p>
  
  <pre><code> nav {  width:1026px;
  height: 50px;
  background-image:url(../img/nav.png);
  padding:0 0px 0 0px;
  text-align:center;
  margin-bottom:30px;
  </code></pre>
  
  <p>}</p>
  
  <pre><code>nav ul li  {
  display:inline-block;
  position:relative;
  </code></pre>
  
  <p>}</p>
  
  <pre><code>nav ul li div.sub {
  display:none;
  position:absolute;
  background-color:#003e88;
  top:38px;
  width:260px;
  text-align:left;
  border-radius: 0px 0px 7px 7px;
  -o-border-radius: 0px 0px 7px 7px;
  -moz-border-radius: 0px 0px 7px 7px;
  -khtml-border-radius: 0px 0px 7px 7px;
  -webkit-border-radius: 0px 0px 7px 7px;
  </code></pre>
  
  <p>}</p>
  
  <pre><code>nav ul li div.sub a{
  background-image:none;
  </code></pre>
  
  <p>}</p>
  
  <pre><code>nav li a {
  padding:13px 20px 11px 20px;
  display:inline-block;
  margin-top:-10px;
  background-image:url(../img/nav-divider.png);
  background-position:top right;
  background-repeat:no-repeat;
  font-family:champ, myriad, Arial, Helvetica, sans-serif;
  font-size:16px;
  text-transform:uppercase;
  font-weight:bold;
  text-decoration:none;
  margin-right:-4px;
  </code></pre>
  
  <p>}</p>
  
  <pre><code>nav li a:hover {border: 0;
  background-image:url(../img/hover.png);
  </code></pre>
  
  <p>}</p>
  
  <pre><code>nav li.current a {
  color:#47cacd;
  </code></pre>
  
  <p>}</p>
  
  <p>I am at a loss with it and any help would be greatly appreciated, Thanks.</p>