Sibling and Child Selectors

[bejitto101]

I was wondering if there is any way to select the first element in a container. Say for example I have the following code:

<div class="box">
<p>Blah blah</p>
<p>Boo hoo</p>
<p>Booyah!</p>
</div>

Is there any way to set properties to the first paragraph only. What I am trying to do is change the margin of the first paragraph to 0 while all the others have top margins of 10px and bottom margins of all the paragraphs as 10px.

The best I could come up with is selecting all the paragraphs that are siblings of paragraphs that and children of the div and setting all their margin-top to 10px. Heres the code for that:

.box p{
margin-top: 0px;
margin-bottom: 0px;
}

.box > p + p{
margin-top: 10px;
}

Is there any easier way to do this?

[Kravvitz]

You can use :first-child (http://www.w3.org/TR/CSS21/selector.html#first-child)

[bejitto101]

Well now I feel like a dork. Thanks a lot though!