li::before not working in IE9
I have a utility nav set up as an unordered list and I would like to use
li::before to insert a pipe "|" symbol between each link in the utility
nav.
Here is my utility nav...
<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>
Here are my styles.
.horizontalnavlinks ul
{
margin: 0;
padding: 0;
list-style-type: none;
}
.horizontalnavlinks ul li
{
display: inline;
}
.horizontalnavlinks li + li::before
{
content: " | ";
padding: 0 10px;
}
The pipes show up great in Chrome and Safari, but don't show up in IE9. In
fact IE9 ignores the enter .horizontalnavlinks li + li::before style.
Everything I read says IE supports pseudo styles. What gives?
No comments:
Post a Comment