nth-child css question
- Started
- Last post
- 9 Responses
- Bullitt
Can't get my head round why this isent working. Can anyone point this out to me?
Trying to change the margin on the second h3 displayed within class 'right'.
.right h3:nth-child(2)
{
margin:0;
}Cheers!
- fadein110
Wow - didn't know you could even do that in CSS ha
- uan0
missing space between h3 :nth-child(2) ?
- ESKEMA0
does it work with !important ?
maybe it's being overridden. try to debug with developer tools or firebug. the rest of the code would help...
- uan0
it works... some other issue in your code..
http://jsfiddle.net/hRKkt/1/
- Bullitt0
Thanks
Could it be that Im trying to pin point a class which has also been used
twice? the class of 'right' I am pin pointing was already used in a div previously on the page. Is there a way round that?
- Continuity0
If you're already using the class right, then try this:
.right > h3:nth-child(2)
- Stugoo0
After this next sentence I'll stop being a dick :
.right isn't very semantic now is it?
anyway, are you trying to target the second header ?
that will only work if you have two or more headers side by side.this wont work, try the :nth-of-type(2);
- sorry, i hope that makes sense :
basically nth-child wont work unless they are all side by side.Stugoo
- sorry, i hope that makes sense :
- ernexbcn0
nth-child doesn't work on IE 8 and earlier, keep that in mind.
- orrinward20
If it's for a single use, I wouldn't use nth child. Give the h3 a specific ID or class.
nth child is more for styling alternate lists and generated content.
If there is a specific h3 element you want to affect, because of it's content or layout, you shouldn't be styling it in a way that would be affected by adding another element in the list.
- this makes sense. thats how I do it. to be fair I have never used the above though. useful for lists.fadein11