li ::之前不在IE9中工作

时间:2013-08-12 17:25:11

标签: html css pseudo-element css-content

我将实用程序导航设置为无序列表,我想使用li :: before来插入管道“|”实用程序导航中每个链接之间的符号。

这是我的实用程序导航...

<div class="horizontalnavlinks">
    <ul>
        <li><a href="/ets/">Time & Expense</a></li>
        <li><a href="/intrnl/voffice/TAC/default2.asp">TAC</a></li>
        <li><a href="/people/search/srchframe.asp">Employee Information</a></li>
        <li><a href="mailto:intranetfeedback@ch2m.com">Can't Find It?</a> </li>
    </ul>
</div>

这是我的风格。

.horizontalnavlinks ul
{
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.horizontalnavlinks ul li
{
    display: inline;
}

.horizontalnavlinks li + li::before
{
    content: " | ";
    padding: 0 10px;
}

管道在Chrome和Safari中显示效果很好,但不会出现在IE9中。实际上IE9忽略了输入.horizontalnavlinks li + li::before样式。

我读到的一切都说IE支持伪样式。是什么给了什么?

1 个答案:

答案 0 :(得分:2)

确保您拥有正确的doctype声明(例如,<!DOCTYPE html>),因为在quirksmode中运行的IE9将不支持伪元素。

有关在IE9中使用伪元素的更多详细信息,请参阅this SO thread