| Controlling <h1> Tags
margin-bottom: -5px; |
pageoneresults
msg:857973 | 6:28 pm on Mar 5, 2002 (gmt 0) |
I'm sure this has been covered before, but at the rate that posts move to thread heaven, I thought it might be a good topic to discuss. How are most of you controlling the appearance of your <h1> tags? I've been using an external style sheet for years and control them like this... h1, h2, h3, h4, h5, h6{
font-family:"verdana", arial, helvetica, sans-serif;
color:#226099;
font-size:15px;
text-align:left;
margin-top:0px;
margin-bottom:-5px;
background:none repeat; The margin attributes are very important here as they control the space before and after the <h1> tag in most browsers (excludes NS4). I also found out through recent testing that you should have the margin-top and margin-bottom attributes in the style sheet set to at least 0px. Opera did not like my <h1> tags without the margin attributes, a little too much space above and below.
|
mivox
msg:857974 | 6:57 pm on Mar 5, 2002 (gmt 0) |
::shuffles feet abashedly:: Never got into using <h1> tags... The few times I have though, I set basic CSS attributes for them, and grinned and bore the gap they left beneath the header text. Next site, I'll have to try your technique, because the spacing gets a bit too weird.
|
tedster
msg:857975 | 7:45 pm on Mar 5, 2002 (gmt 0) |
The spacing gaps are hard to control cross-browser because NN4 doesn't collapse margins properly between two boxes when they touch. You can get a nice look from NN4 if you browser sniff and give it a new css file (just one element to cascade in, not a biggie). The approach I use is this: 1. h1, h2, h3, h4, h5, h6 {margin-bottom:0 em;} 2. A special class of P tag (p.follow) is created for the text that follows the H tag. p.follow {margin-top:0 em;} This works for most browsers 3. Sniff for NN4 and then cascade in a Netscape only style that gives p.follow a -1 em margin-top instead of the 0 em p.follow {margin-top:-1em;} Now Netscape 4 will collapse the margins visually the same as the others.
|
|
|
