Why is IE ignoring my height decleration?

Ive set a block 10 pixels high to display a background image on my
site, Fifrefox is OK with it, yet IE seems to be ignoring it totally?

You can see it here, Ive added a red border round the offending element
to illustrate my point. Compare IE's rendition with Firefox

This is the CSS rule Ive set:

#bodyBackground {
background-image: url(../images/body_top.png);
background-repeat: no-repeat;
height: 10px;
border: 1px solid #FF0000;
}

This is the page

http://www.ainewmedia.co.uk/index.asp

john_aspinall (AT) yahoo (DOT) co.uk wrote:

Ive set a block 10 pixels high to display a background image on my
site, Fifrefox is OK with it, yet IE seems to be ignoring it totally?

IE is stretching the element's height to encompass the content. Now I
know there is no content in it, but IE still gives it the minimum
height required to contain a character. To avoid that you could set
the font-size and the line-height to a small enough size for that
element, or give it overflow:hidden;.

--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/

Perfect, thanks mate.

Els wrote:

john_aspinall (AT) yahoo (DOT) co.uk wrote:

Ive set a block 10 pixels high to display a background image on my
site, Fifrefox is OK with it, yet IE seems to be ignoring it totally?

IE is stretching the element's height to encompass the content. Now I
know there is no content in it, but IE still gives it the minimum
height required to contain a character. To avoid that you could set
the font-size and the line-height to a small enough size for that
element, or give it overflow:hidden;.

--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/