Плавающий: правый элемент li разрушается в движении ie7

Question

Это ссылка http://jsfiddle.net/a6K3f/1/.

Мне нужно иметь одну ссылку вправо, выровненную в меню навигации. Ниже код хорош во всех основных браузерах, за исключением ie7. Выровненный по правому краю «Link4» разрушается. Я знаю, что это работает, если я добавляю floated: right li как первый li в ul. Но я не могу добавить как первый li. Becasue я написал pseduo классы первого ребенка для этого.

Я пробовал много испытаний, но еще не решил. Кто-нибудь может помочь в моей проблеме. Благодаря

HTML:

<ul> 
    <li>Link1</li> 
    <li>Link2</li> 
    <li>Link3</li> 
    <li class="f-Right">Link4</li> 
</ul> 

CSS:

body { 
    font-family: arial; 
    font-size: 13px 
} 
ul { 
    list-style: none; 
    margin: 0; 
    padding: 0 
} 
ul li { 
    display: inline-block; 
*display:inline; 
    zoom: 1; 
    border: 1px solid #ccc; 
    margin: 0 1px; 
    padding: 3px 
} 
.f-Right { 
    float: right 
} 

Answer 1

Как это

пожалуйста write*float:left; и remove

*display:inline; 

demo

CSS

body { 
    font-family: arial; 
    font-size: 13px 
} 
ul { 
    list-style: none; 
    margin: 0; 
    padding: 0 
} 
ul li { 
    display: inline-block; 
    *float:left; /* <--hack for IE **/ 
    zoom: 1; 
    border: 1px solid #ccc; 
    margin: 0 1px; 
    padding: 3px 
} 
.f-Right { 
    float: right 
}