Given the following HTML:
<ul>
<li><div>Some content</div></li>
<li><div>some more content</div></li>
<li><div>final content</div></li>
</ul>
I would like to apply a top border around each div. On the last div I would like to put a bottom border. I am targeting IE7/8. I have the top border working fine, I need help getting the bottom border.
I've tried:
ul > li:last-child > div
{
border-bottom: solid 1px black;
}
I've also tried using last-type-of.
I am looking for a CSS solution and a Jquery solution