浮动:右侧li元素在ie7导航中断开

时间:2014-01-16 07:14:31

标签: css browser internet-explorer-7

这是链接http://jsfiddle.net/a6K3f/1/

我需要在导航菜单中右对齐一个链接。除了ie7之外,所有主要浏览器的代码都可以。右对齐的'Link4'正在崩溃。我知道如果我添加了浮动的话它是有效的:正确的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
}

1 个答案:

答案 0 :(得分: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
}
相关问题