Height attribute problem in IE?

Question about height problem IE vs Mozilla

[Spencer_P]

Hi,

I am building a site and wish to put in a simple band of colour from one end of my site to the next.

The site is 800px wide and I want a band about 2px high.
However when I view the band in IE it just defaults to a set size?
Yet when I view the site in mozilla the band is 2px?

My css is:

.banding {
width: 800px;
height: 2px;
background-color: #5574b9;
}

Hope someone can help?

Thanks

Spence

[bgirl]

This can happen when you have a space or return in your html in IE. IE is adding a blank space at the same height as your font.

So if your html looks like this:

<div class="banding">
</div>
<div class="banding"> </div>

then change to one line, no spaces or other text:

<div class="banding"></div>

[penders]

The height of your band (DIV?) maybe to do with the default font-size in the element (IE might be expanding to fit)... try setting

font-size:1px;

?

[bedlam]

Penders has it right, it's the font-size in the element. But the best solution is probably not to reduce the font size in the element; it'd be much better just to put a border on an element that's already on the page.

Chances are that your whole layout is already sitting in some 800px wide element and that adding...

border-top:2px solid #5574b9

...to the css declarations for that element would work as well or better than the extra div.

-b

[Spencer_P]

Thanks for thank the font size did the trick :)
I tried the border css but I couldn't get it to work?

Thanks again

Spence

[Spencer_P]

Thank for thank?....I meant thanks for that :)