first-child issue

[cybershot]

I have four columns in my page structured like so

I created a css rule to spread them out with 28px left margin. I need the first one to have zero left margin. So I tried

#content .columns:first-child {

margin-left: 0;

}

It’s not working. How can I select that first div that will work cross browser?

[TheDoc]

Your first child has a class name of ‘column’, not ‘columns’. That’s why it’s not working.

[TheDoc]

It should be working fine. Do you have a link? Or even pasting the exact code could help.

Remember that when using first-child the element you are selecting must be the actual first child of your #content container. For example, if you had a header tag before the first .columns div, .columns:first-child will never be true.

[Author]

Posts