Quote:
Originally Posted by hobnail
I'd rather keep things simple and let the ereader use whatever size it uses. I'd like to make the h2 text even smaller
|
Aren't those two things contradictive?
My suggestion: don't rely on "whatever size it uses" being anything reasonable, set what you want, but in relative terms, e.g.:
Code:
h2 { font-size: 100% }
h2 span { font-size: 120% }
Anyway, relative sizes are relative to the container element, so yes, changing the h2 size will affect the absolute size of the span inside, but not its relative size, it will always be 120% of whatever a bare h2 is.
Or maybe what you really want is:
Code:
<h2><span class="number">One</span><span class="title">Old Man Arlo’s dogs</span></h2>
h2 span.number{ font-size: smaller }
h2 span.title { font-size: larger }
Now "One" will be one step smaller (whatever that is) than a bare h2, and "Old Man Arlo’s dogs" will be one step larger, so they will be separated by two steps. A similar thing you should get with:
Code:
<h2>One <span><span>Old Man Arlo’s dogs</span></span></h2>
h2 { font-size: smaller }
h2 span { font-size: larger }