Witte rand in div IE

[4of9]

Hoi,

Ik heb voor jullie waarschijnlijk een simpel vraagje.

Ik heb 2 divjes boven elkaar staan:

een header en een "randje"

code:

____________________
HEADER
____________________
Randje
____________________
|               |                  |
|               |                  |

Nu zit er in IE een wit ranje zowel onder als boven in het randje div.

ik heb al min-height en _height geprobeerd maar niets lijkt te werken.
Ook padding en margin op 0 zetten helpt niet.

is dit een bug in IE of hoe kan ik dit oplossen?

Cascading Stylesheet:

* 
{
    font-family: Verdana;
    font-size: 10px;
}

body {
    margin: 0px;
    padding: 0;
    text-align:center;/* center layout in ie5 and 5.5. */
}
#container {
    width: 950px;
    margin: 0px;
    margin-left: 0;
    margin-right: auto;
    background-color: #d9fafa;;/* this is the background colour of the right column */
    border: 1px solid #000;
    text-align:left;
    background-image: url(../images/bg.gif);
    background-repeat: repeat-y;
    background-position: left top;
}
#content {
    border: 1px solid #000;
    padding: 0;
    
    /*
    background-image: url(images/navbg.gif);
    background-repeat: repeat-y;
    background-position: left top;
    */
}
#left {
    float:left;
    border-right:1px solid #000;
    width:195px;
    background-image: url(../images/tile.gif);
    background-repeat: repeat;
}

#right {
    float:left;
    width:650px;
    border-left:1px solid #000;
    margin-left:-1px;/* makes border line up with #left border */
}

#header 
{
    background:#ffffff;
    text-align:center;
    padding:0;
    margin:0;
}
 
#header_shadow 
{
    background-image: url(../images/shadow.gif);
    background-repeat: repeat-x;
    _height:  5px;
    min-height: 9px;
    text-align:center;
    padding: 0 0 0 0;
}

#footer {
    background:#ffffff;
    text-align:center;

}

HTML:

<div id="container"> 
            <div id="header">
                <img src="images/banner.gif" alt="" />
            </div>
            <div id="header_shadow"></div>
            <div id="content"> 
                <div id="left">
                    <p>Pellentesque dolor odio, egestas nec, tempus sit amet, pretium vel, ligula. Vivamus gravida felis quis neque. Cras tristique turpis. Nulla sollicitudin condimentum odio. Morbi lobortis sem eget sapien. Nulla nunc lacus, pulvinar eu, convallis sed, tincidunt vel, enim. Nulla aliquam, massa at adipiscing pretium, erat nulla posuere nisi, sit amet vestibulum libero ligula quis nisl. Phasellus venenatis, nibh id ultricies dapibus, nunc risus ultrices nunc, vitae suscipit nulla libero et est. Donec tellus enim, aliquam vel, volutpat ut, pellentesque nec, orci. Duis ornare. Cras ut tellus at elit volutpat scelerisque. Vivamus suscipit velit nec arcu. Aliquam erat volutpat.</p>
                </div>
                <div id="right"> 
                    <p>Pellentesque dolor odio, egestas nec, tempus sit amet, pretium vel, ligula. Vivamus gravida felis quis neque. Cras tristique turpis. Nulla sollicitudin condimentum odio. Morbi lobortis sem eget sapien. Nulla nunc lacus, pulvinar eu, convallis sed, tincidunt vel, enim. Nulla aliquam, massa at adipiscing pretium, erat nulla posuere nisi, sit amet vestibulum libero ligula quis nisl. Phasellus venenatis, nibh id ultricies dapibus, nunc risus ultrices nunc, vitae suscipit nulla libero et est. Donec tellus enim, aliquam vel, volutpat ut, pellentesque nec, orci. Duis ornare. Cras ut tellus at elit volutpat scelerisque. Vivamus suscipit velit nec arcu. Aliquam erat volutpat.</p>
                </div>
                <div style="clear:both"></div>
            </div>
            <!--
            <div id="footer"> 
                <h1>Footer</h1>
            </div>
            -->
        </div>

Ik hoop dat jullie me wat verder kunnen helpen!

[André]

Dat is white-space, zet de </div> van regel 4 maar eens direct achter je image.

[Cubix]

Of maak van je img een block element.

[4of9]

dank je!

stom stom stom!

[DamadmOO]

En ik zou sowieso het plaatje van je header in de css file aanroepen. Splitsing layout en markup