Re: Line width and empty line

Hi Bruce,

> Note that there is no content - from the htm
>
> <!-- Empty header, with a style sheet status for background color, 
> creates a bar across the top of the screen. -->
> <h2>
> </h2>
>
> And no content. But in IE a 'line' is there and that explains the 
> wideness. If I add a font item for h2 in the style sheet, say  
> 'font-size: 2pt.' then the yellow line narrows nicely. But why does IE 
> 'insert' an empty line and is that correct behavior.
>
> Also, if no font size specified, where does IE get the font size for its 
> empty line. I assumed from the body, which is 7 point, so tried changing 
> that to 24 point without effect on the line width. So, again, where does 
> the default font size for that header line come from??

First of all you really should not use a heading element for conveying 
style. This sort of styling is best done using either div or span and/or 
images.

Internet Explorer sometimes does very strange things. Viewing your page 
with a couple of different browsers, all except IE show an approximately 
10px high yellow line whereas IE renders this element in such a way that 
an approximately 46px high line (rather a box) results.

I am not sure but I guess that IE takes the height of the previous 
h1-Element for calculating the height of the h2-element. You specified a 
bottom-padding of 0.7em for the h2-element. Probably the rendering engine 
treats the height of your image in h1 same as font-size adding even some 
odd 8pixel and then multiplies these with 0.7 to result in the padding of 
h2.
Then again my explanation might be utter rubbish :-)
It would help knowing the default style-sheet of IE for a more correct 
explanation.

Best would be using div or span and specifying not only width but also 
height for this element.

Hope this might help.

jens

HWG hwg-techniques mailing list archives, maintained by Webmasters @ IWA