CSS Adjacent Sibling Combinators With Text

August 26, 2009 by J.P.

siblings_01
Here is a short and sweet post demonstrating the use of adjacent sibling combinators with text is an easy way to work with unique spacing with headers and copy in general.

Basic Example Code
h1 + p{
padding:20px 0 0;
}
h2 + p{
padding:0px 0 0;
}
h3 + p{
padding:0px 0 0;
}

Here is a link with 3 different headers and style demoing how convenient this approach is.

Eaching header has a unique spacing when followed by a <p/> tag.


No Comments

No comments, It's quiet in here, only echos exist. To the north is a white mailbox.

RSS feed for comments on this post. TrackBack URL

Leave a comment