Quote:
Originally Posted by rjwse@aol.com
<body>
<h2>text</h2>
<ol>text</ol>
<p>text</p>
<h2>text</h2>
<img />
<p>text</p>
</body>
h2 ~ p:first-of-type{} will change only first p.
(h2 ~ p):first-of-type {} would change all p's (it's a 'reset') but css does not allow.
Instead, add class="h" to all H2s and
.h ~ p:first-of-type {} and this will change both p's.
no such thing as first-of-class either.
The other way to accomplish both p's being changed is to split the xhtml segment into two to isolate the H2s.
Shazam! |
If we think of real books, it is common to see a certain pattern for headings. So, you could use something like this to create dropcaps, without using classes:
Code:
h1 + p::first-letter {
font-size: 3.5em;
float: left;
line-height: 1em;
margin-bottom: -0.284em;
margin-right: 0.05em;
margin-top: -0.16em;
}
If you have something else after the h1, maybe an hr, or an img, just add it:
Code:
h1 + hr + p::first-letter {
css code here
}
This would work on multiple h2 on a single file either, as long as they all follow the pattern.