Hi there,
I have a horizontal ul / list-item menu with a right-border on each li. I do NOT want the right border on the last item in the list. Why isn't this working?
li {
height: 16px;
list-style-type: none;
float: left;
margin: 8px 20px 0 0;
padding-right: 20px;
border-right: 2px white solid;
}
li:last-of-type: {border: none;}
------------------------------------------------
<ul>
<li>About Us</li>
<li>Areas of Practice</li>
<li>Our Attorneys</li>
<li>Resources</li>
<li>Contact Us</li>
</ul>
------------------------------------------------
I would normally put a class on the last li and do it that way, but this menu is going to be database driven and I can't get in there. Can't I use the 'last-of-type' pseudo-selector? It's not working for me. Thanks much,
Bill
I have a horizontal ul / list-item menu with a right-border on each li. I do NOT want the right border on the last item in the list. Why isn't this working?
li {
height: 16px;
list-style-type: none;
float: left;
margin: 8px 20px 0 0;
padding-right: 20px;
border-right: 2px white solid;
}
li:last-of-type: {border: none;}
------------------------------------------------
<ul>
<li>About Us</li>
<li>Areas of Practice</li>
<li>Our Attorneys</li>
<li>Resources</li>
<li>Contact Us</li>
</ul>
------------------------------------------------
I would normally put a class on the last li and do it that way, but this menu is going to be database driven and I can't get in there. Can't I use the 'last-of-type' pseudo-selector? It's not working for me. Thanks much,
Bill