The above title has a fun drop cap which extends down and alters the behavior of this paragraph. By changing the size of your browser window, you should be able to see this text wrap BELOW the title's first letter.
h1:first-letter {
font-size: 2.5em;
vertical-align: top;
float: left;
margin: 0; padding: 0;
overflow: hidden;
}
bleeds into this paragraph. If IE didn't suck
we could simplify this code by not having to use ANY class for the paragraph since
this selector should be sufficient: h2, h2 + p {}.
/* this is the "ideal" */
h2, h2 + p { display: inline; }
/* this makes IE work too */
h2, p.first { display: inline; }
If you're using IE, you won't see this effect to its fullest because it uses the :before pseudo-class on the header to make it look like this:
h3:before { color: #900; content: "Good browsers show this title AND "; }
/* this is used in the demonstration
for IE purposes */
h4 span { color: #900; }