Нечетная ошибка Internet Explorer 7; не правильно подсчитывать прописку по ссылкам

Question

Похоже, что я страдаю от новой ошибки в IE7, поскольку, похоже, я не могу найти ссылки на нее где-либо еще. Это лучше всего объяснить с помощью скриншотов, так что вот несколько ссылок (и в качестве примечания, это не является обязательным условием для работы в IE6, поэтому я даже не хочу знать, как это выглядит под этим!):

Как это должно быть показано (с помощью Safari 4): http://dl-client.getdropbox.com/u/45961/safari4.png

Как IE7 отображает его: http://dl-client.getdropbox.com/u/45961/ie7.png

Вот CSS для этого меню фрагмента:

#mm #leftNav .navigation { 
    width: 100%; 
    margin-bottom: 0; 
    float: left; 
} 

#mm #leftNav li { 
    list-style: none; 
    display: inline; 
    margin: 0; 
} 

#mm #leftNav .navigation li ul { 
    display: none; 
} 

#mm #leftNav .navigation li a { 
    text-decoration: none; 
    color: #ffffff; 
    font-size: 11pt; 
    padding-left: 20px; 
} 

#mm #leftNav .navigation li { 
    cursor: pointer; 
    margin-right: 4px; 
    padding-left: 8px; 
    padding-right: 8px; 
    padding-top: 10px; 
    padding-bottom: 8px; 
    overflow: visible; 
} 

.menu_item { 
    background: #419185; 
} 

.menu_item:hover { 
    background: #48a093; 
} 

.currentcat { 
    background-color: #4aa8a6; 
} 

.currentcat:hover { 
    background: #4aa8a6; 
} 

И вот HTML:

<div id="mm"> 
    <div id="leftNav"> 
     <ul class="navigation"> 
      <li class="menu_item"> 
       <a class="icon icon-base">Base</a> 
      </li> 
      <li class="menu_item"> 
       <a class="icon icon-devices">Devices</a> 
      </li> 
      <li class="menu_item"> 
       <a class="icon icon-management">Management</a> 
      </li> 
      <li class="menu_item"> 
       <a class="icon icon-iptools">IP Tools</a> 
      </li> 
      <li class="menu_item"> 
       <a class="icon icon-config">Configuration</a> 
      </li> 
      <li class="menu_item"> 
       <a class="icon icon-admin">Administration</a> 
      </li> 
     </ul> 
     <div id="subnav"></div> 
    </div> 
</div> 

Любые идеи?

Answer 1

верхних и нижние отступы не поддерживаются на встроенных элементах (некоторые браузеры делают это, другие не будут)

Вот хорошая статья по данной проблеме:

http://www.maxdesign.com.au/presentation/inline/

Если вы действительно вам нужно изменить элементы меню, вы должны изменить пункты меню на «display: block» и «float: left»

Answer 2

Хехе, activa избили меня до него. Действительно, перемещение маржевого/отступы к элементу, вроде как так:

мм #leftNav .navigation Ли с {

text-decoration: none; 
color: #ffffff; 
font-size: 11pt; 
display:block; 
float:left; 
background: #419185; 
margin-right: 4px; 
padding-left: 20px; 
padding-right: 8px; 
padding-top: 10px; 
padding-bottom: 8px; 

}

мм #leftNav .navigation Li {

cursor: pointer; 

}

.menu_item {