Html Can'；在IE中无法使用简单的水平菜单

我正试图设置一个带有背景图像和文本按钮的水平菜单，但它在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;
}

及

在chrome中没问题，但在IE中，菜单是水平的，我没有发现问题

---

谢谢

删除css规则中的所有空格（虚线附近），同时删除

float:right来自
ul.barnoire li a
样式

编辑

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


另外，这在IE8上对我有效…
尝试使用
列表样式
而不是
列表样式
在IE11中对我有效，这里的jsiddle：你必须删除破折号前后的所有空格
-
。您的CSS无效。在这里粘贴并验证：在stackoverflow上发布时添加了空格，它们不在我的css中。。。我终于改变了我的方式，现在它起作用了，谢谢。
<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>