li:last-child doesn't seem to work in IE8
Solution 1
You read it wrong. It says that it's not supported in IE8:
If you were looking at :first-child
, which does have support in IE7 and IE8, and thinking that the same applies to :last-child
... surprise! It doesn't.
:first-child
is a CSS2 selector, but :last-child
was only introduced in CSS3, so since Microsoft was only aiming for CSS2.1 compliance with IE8, they likely didn't bother about :last-child
until post-IE8.
If you know you will only have four li
elements, then you should be able to use adjacent sibling selectors to reach the fourth li
:
.footerMenu li:first-child + li + li + li
Solution 2
To build on the other guys answers, an alternative could be to use javascript to fill the gaps, selectivizr is a good example of adding last-child support.
Solution 3
Where did you read that? :first-child
is supported back to IE7, but :last-child
is IE9 and later.
(Headers moved down for your convenience)
Solution 4
The link you provided shows that it isn't supported for IE8... IE9+ only. Googling last-child IE8 brings up a whole host of similar queries.
user1184100
Updated on June 04, 2022Comments
-
user1184100 almost 2 years
Below is my html structure
<div class="footerMenu"> <ul> <li>Home</li> <li>About</li> <li>Feedback</li> <li>Contact us</li> </ul> </div>
But
.footerMenu li:last-child { }
selector doesn't seem to work in IE8. But http://msdn.microsoft.com/en-us/library/cc351024%28VS.85%29.aspx tells that the pseudo-selector is suppported.Any help on this!