Take the 2-minute tour ×

I have two labels within a li amd i want to style second label, is there a way to target the second label. It has to work on IE7

I wrote like this

             <label for="asi plan status">A&SI Accountable VP:</label>
             <label>Tye Schriever</label>

ul li label label{color:red}

Any other way..?

share|improve this question
The CSS3 way would be: ul li label+label, but I'm not sure if IE7 supports this. –  Exelian Sep 16 '11 at 9:29
Adjacent sibling? That's CSS 2.1, I think, not 3. And IE has problems up to, and including, version 8. –  David Thomas Sep 16 '11 at 9:34
@Exelian @David Thomas: AFAIK IE7/IE8 only have parsing problems with it in very specific situations. ul li label+label should work correctly. And yes + is a CSS2.1 selector. Just because it's not syntax you see every day, or you think it has poor IE support, does not make it a brand new CSS3 feature. –  BoltClock Sep 16 '11 at 13:36
add comment

4 Answers

up vote 2 down vote accepted

you can use css2 :first-child property define your properties for second label in common & through first-child you can override the css property for first label like this:


it's supported by IE7 also but approach is different.

share|improve this answer
Working perfectly –  Ravi Sep 16 '11 at 9:47
happy to help :) –  sandeep Sep 16 '11 at 9:48
add comment

If you only need to target the second label and nothing else, you can use

ul li label + label

No need for overrides or CSS3's :last-child or adding classes to work around IE, etc. Although the comments mention IE7 and IE8 having problems with the + selector, it should work properly in this situation.

share|improve this answer
add comment

As other people have mentioned, there are legitimate CSS selectors to achieve what you want, but IE7 doesn't support those selectors.

When I need to patch support for :last-child in IE7, I use this technique with jQuery:

$('li label:last-child').addClass('last-child');

And then in my CSS I can use use

li label.last-child {
  /* some styles here */

So we leverage jQuery excellent CSS selector support to apply a class to the elements you want to style, and then style them in the CSS>

share|improve this answer
If :last-child is anything that doesn't require a long chain of + selectors to reach, use + instead for free IE7 support. –  BoltClock Sep 16 '11 at 13:59
Quite right, this is just a more universal solution for using :last-child with IE7. –  Alex Sep 16 '11 at 14:01
add comment

You may use the :last-child-selector, but that isn't supported by Internet Explorer.

li label:last-child { color:red }

Assign a class-attribute to the label instead, to get it properly working on all browsers.

share|improve this answer
add comment

Your Answer


