View Single Post
Old 06-15-2020, 01:02 PM   #4
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by hobnail View Post
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 }
Jellby is offline   Reply With Quote