empty line with H tag, how to get rid of it with CSS

[autogoor]

The empty line that is inserted by most browsers between H1/H2/H3
heading tags and a following P block is very annoying and I would
really like to get rid of it (without having to give up on using the
H1/H2/H3 tags).

I put
H3{
margin : 0px;
}

It eliminates only the empty line on top of H3, not th eline below of
it. How can I pix it?

I am using IE.

Thanks,

[Steve Pugh]

au******@yahoo.com wrote:

The empty line that is inserted by most browsers between H1/H2/H3
heading tags and a following P block is very annoying and I would
really like to get rid of it (without having to give up on using the
H1/H2/H3 tags).

I put
H3{
margin : 0px;
}

It eliminates only the empty line on top of H3, not th eline below of
it.
You need to remove the margin above the paragraph as well as the one
below the heading. In CSS adjacent vertical margins combine to the
height of the tallest.
How can I pix it?
h3 {margin-bottom: 0;}
p {margin-top: 0;}

Of course, in theory you would use
h3 + p {margin-top: 0;}
to only remove the top margin from those paragraphs that follow the
heading. But as IE doesn't support the sibling selector + we need to
use the more general rule.
I am using IE.

So what? Are you building this web site just for yourself or for
visitors as well?

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>

[Harlan Messinger]

au******@yahoo.com wrote:

The empty line that is inserted by most browsers between H1/H2/H3
heading tags and a following P block is very annoying and I would
really like to get rid of it (without having to give up on using the
H1/H2/H3 tags).

I put
H3{
margin : 0px;
}

It eliminates only the empty line on top of H3, not th eline below of
it.

There is no empty line. It eliminates the margin, which can probably be
inferred from the fact that the CSS for this is

margin: 0;

and not

empty-line: none;

In any event, CSS uses that logic that the vertical separation between
adjacent blocks is the *larger* of the bottom margin of the upper block
and the top margin of the lower block. In other words, each block is at
*least* as far away from its vertical neighbors as it wants to be, and
as far away as *they* want to be if that's larger. This is instead of
adding the margins together, as is done for horizontal placement, which
usually results in separations much larger than desired.