OT: CSS--Kill extra vertical space in block elements
Sannyasin Sivakatirswami
katir at hindu.org
Fri May 7 01:25:46 EDT 2004
I build widgets with Revolution that output HTML for different
contexts. No better told for that for sure!
Forgive me for going way off topic here, but no better pool of minds to
draw from than the Rev family ;-) I just couldn't help myself...
I'm just getting into CSS, it's great.. and I have one challenge I
can't solve.
It is the universal default that block elements apply extra padding top
and bottom... i.e. extra vertical white space.
Coming from a print world
<h4>Learn about Tropical Fruits<h4>
<p>A paragraph about tropical fruits</p>
<p>Another paragraph about papayas</p>
Should all have no extra space between them unless the designer
specifically declares it with a a space before or after value applied
to the paragraph formatting. And of course there is some minimal auto
leading set as a percentage of the M height of the current font size.
I always cringed in web development when <h> elements forced a gaping
horizontal "hole" across the page... in effect, it appears as the
insertion of an unwanted blank line.... and was hoping with CSS there
would be some way to overcome the extra vertical white space added to
all block elements...
Of course, one can do stuff like this:
<p>A paragraph about tropical fruits<br />
<p>Another paragraph about papayas</p>
but then you lose separate style control over the two lines... email me
off list if you know of a solution or a place to go on the web to find
it... I have Dan Schafer's great book, HTML Utopia: Designing without
Tables using CSS... but I can't get any combination of properties to
"kill" the block elements' extra vertical default padding. The "height"
property is too inflexible... because the content is dynamic and a
single height value won't work if e.g. the text suddenly goes to three
lines instead of two. I was hoping line-height=1 would work, and act
like a print document layout program would=-provide the vertical white
space required by the font height and no more. But, no go.
I'm guessing browsers have some kind of super high value for block
element "auto-leading" that was established in the early days of the
web and the question is how to defeat that?
TIA
Sannyasin Sivakatirswami
Himalayan Academy Publications
at Kauai's Hindu Monastery
katir at hindu.org
www.HimalayanAcademy.com,
www.HinduismToday.com
www.Gurudeva.org
www.Hindu.org
More information about the use-livecode
mailing list