[CSS] Extra margin?

[borstel]

^{(opgelost, zie edit onderaan)}
Heb al een tijdje lopen prutsen maar kom er gewoon niet uit. Ziet er in Firefox/Opera prima uit, maar je raadt het al... IE doet weer raar Zie ik een kleine CSS regel over het hoofd wat dit kan fixen?

Ik zal even screenshot laten zien om het duidelijk te maken. Top met image sluit niet netjes aan op de content in IE.

Cascading Stylesheet:

html,
    body {
        background-color:#EBE2D1;
        margin-top:10px;
        margin-bottom:15px;
    }
    #site {
        margin-left:auto;
        margin-right:auto;
        width:703px;
        background-color:#EBE2D1;
    }
    #header {
        width:703px;
        height:211px;
        background-color:#EBE2D1;
        background-image:url(../images/header.gif);
        margin-bottom:10px;
    }
    #top {
        width:703px;
        height:13px;
        background-image:url(../images/top.png);
        background-repeat:no-repeat;
        background-color:#EBE2D1;
    }
    #content {
        width:683px;
        background-color:#fff;
        padding-left:10px;
        padding-right:10px;
    }
    #bottom {
        width:703px;
        height:13px;
        background-image:url(../images/bottom.png);
        background-repeat:no-repeat;
        background-color:#EBE2D1;
    }

HTML:

<div id="site">
    <div id="header"></div>
    <div id="top"></div>
    <div class="default" id="content">content</div>
    <div id="bottom"></div>
</div>

/edit

Zal je het net zien, post je het op GoT omdat je er niet uit komt, voeg je de regel ' overflow:hidden;' toe aan de #top. En hij doet het.

[ Voor 6% gewijzigd door borstel op 22-12-2006 16:27 ]

[crisp]

line-height en/of font-size verkleinen helpt ook

otoh is je #top redelijk overbodig aangezien je die background-image ook gewoon op #content kan zetten met een no-repeat en een padding-top...

[ Voor 58% gewijzigd door crisp op 21-12-2006 23:39 ]

[borstel]

Dat is een mooiere oplossing, beetje overbodig inderdaad, bedankt