“first-child” vs. “last-child” Pseudo Class in CSS3

I have a navigation menu that adds a pipe after each menu item using the “border-right” CSS class.  Unfortunately, IE does not play nice with the “last-child” pseudo-class that I was using to remove the pipe from the last element.

The solution to the problem was to reverse my thinking, and use the “border-left” CSS class along with the “first-child” pseudo-class.  For some reason, the “first-child” pseudo element was included in the CSS2 definition and has wide cross-browser support.  The “last-child” class, however, is a CSS3 definition and enjoys only a fraction of “first-child”‘s cross-browser support.

Thanks to: http://stackoverflow.com/questions/1293369/using-last-child-in-css/2298443#2298443

Posted in

Toby Cryns

Toby Cryns is a freelance CTO, expert WordPress consultant, and teacher.

He offers free advice to improve your freelance biz.

He also publishes small droppings every now and then to twitter.com/tobycryns and twitter.com/themightymo

Follow Toby's contributions on Github and WP.org.