Question

我试图设置一个水平菜单，背景图片是一个文本按钮，但它根本无法在Internet Explorer下工作，我想哭...

这就是我的所作所为：

ul, li, ul li {
    padding: 0;
    margin: 0;
    list - style: none;
    border: none;
    background - image: none;
}
li {
    float: left;
}

ul.barrenoire {
    width: 790px;
    float: right;
    background - image: url('barrenoire.png'); /*790x24*/
    background - repeat: no - repeat;
    background - position: top right;
}
ul.barrenoire li {
    line - height: 0px; /*else height is too big*/
}
ul.barrenoire li a {
    display: inline;
    float: right;
    width: 150px;
    line - height: 24px;
    text - align: center;
}

和

<ul class="barrenoire">
    <li><a style="width:30px"></a>
    </li>
    <li><a href="qsn">Qui sommes nous ?</a>
    </li>
    <li><a href="p">Parrainnage</a>
    </li>
    <li><a href="cs">Candidature spontannée</a>
    </li>
    <li><a href="c">Contact</a>
    </li>
    <li><a href="rn">Rejoignez-nous</a>
    </li>
</ul>

在Chrome中没关系，但在IE浏览器中菜单是水平的，我没有发现问题。

由于

Answer 1

从css规则中删除所有空格（在破折号附近），并从float:right;样式中删除ul.barrenoire li a。

修改

如果这会破坏您在其他浏览器上的风格，请使用条件样式表

<强> Here is a reference

P.S。这在IE8上对我有用......

无法在IE中获得简单的水平菜单

1 个答案: