Probleem met 3 kolommen in css

[koenevers]

Ik ben al de hele avond aan het vogelen maar ik kom er echt niet uit.
Ik heb het probleem dat ik firefox tussen mijn inhoudsheader en mijn drie kolommen een open ruimte verschijnt van ongeveer 5 pixels. Deze ruimte krijg ik met geen mogelijkheid weg. In internet explorer heb ik dit probleem niet. Kan iemand mij helpen?

Hieronder de codes:

HTML

PHP:

<div id="container">

<div id="inhoud">

<div id="inhoud_top">
<div id="inhoud_top_1">sitemap  contact  gedragsregels
</div>

<div id="inhoud_top_2">
<ul>
 <li><img src="media/opmaak/inhoud_menu_overlap2.jpg" /></li>   
 <li><img src="media/opmaak/inhoud_menu_forum.jpg" /></li>
 <li><img src="media/opmaak/inhoud_menu_fotos.jpg" /></li>
 <li><img src="media/opmaak/inhoud_menu_sponsors.jpg" /></li>
 <li><img src="media/opmaak/inhoud_menu_programmaenuitslagen.jpg" /></li>
 <li><img src="media/opmaak/inhoud_menu_actueel.jpg" /></li>
 <li><img src="media/opmaak/inhoud_menu_clubinfo.jpg" /></li>
 <li><img src="media/opmaak/inhoud_menu_overlap1.jpg" /></li>
</ul>
</div>

<div id="inhoud_top_3"></div>

</div>
<div id="kolommen">
    <div id="linkerkolom">linkerkolom</div>
    <div id="middelkolom">middelkolom</div>
    <div id="rechterkolom">rechterkolom</div>
    <div class="clear">
</div>

</div>
</div>
</div>
</div>

Cascading Stylesheet:

html {
    background-color: #43474A;
}
body {
    width: 1077px;
    left: auto;
    right: auto;
    position: relative;
    margin: 0 auto;
    background-color: #3C3D3D;
}
img {
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;

#container {
    background-color: #4E4E4E;
    padding-top: 4px;
}

#inhoud {
    width: 979px;
    margin-left: auto;
    margin-right: auto;
}


#inhoud_top {
    background-image: url(../media/opmaak/inhoud_top_bg.jpg);
    background-repeat: no-repeat;
    width: 979px;
    top: 5px;
    padding-top: 9px;
}


#inhoud_top_1 {
    background-image: url(../media/opmaak/inhoud_top_1_bg.jpg);
    background-repeat: no-repeat;
    height: 62px;
    width: 961px;
    text-align: right;
    margin-right: 9px;
    margin-left: 9px;
    background-color: transparent;
}
#inhoud_top_2 {
    background-image: url(../media/opmaak/inhoud_top_2_bg.jpg);
    background-repeat: no-repeat;
    margin-left: 9px;
    margin-right: 9px;
    height: 25px;
    width: 961px;
    text-align: right;
}
#inhoud_top_2 ul {
    margin-right: 0px;
    margin-top: 0px;
    float: right;
    padding-right: 0px;
    background-color: white;
}
#inhoud_top_2 li {
    display: inline;
    padding: 0px;
    float: right;
}

#inhoud_top_3 {
    height: 5px;
    width: 100%;
    background-color: white;
}


#kolommen {
    width: 100%;
    padding: 0;
    margin: 0;
}
#linkerkolom { float: left; width: 20%; background-color: yellow; }
#middelkolom { float: left; width: 60%; background-color: red; }
#rechterkolom { float: left; width: 20%; background-color: pink; }
.clear { clear: both; }

[Verwijderd]

Zou je het binnen code-tags willen zetten? Dan is het wat leesbaarder.

Edit:

De "inhoud_top_2" ul is je probleem, deze heeft een margin en float right. Omdat er niet gecleard wordt, gaat ie moeilijk doen.

Wat ik zou doen:

Cascading Stylesheet:

#inhoud_top_2 li {
display: inline;
padding: 0px;
float: right;
}

wijzigen in:

Cascading Stylesheet:

#inhoud_top_2 li {
clear: right;
display: inline;
padding: 0px;
float: right;
}

Verder heb je een </div> te veel en vergeet je iets af te sluiten in de css.

[ Voor 75% gewijzigd door Verwijderd op 23-01-2009 21:34 ]

[Tehkram]

Probeer met deze problemen altijd even een padding, margin of border reset te doen in de div's waar de problemen in voorkomen,

en zoals degene hier boven me ook al zei, zorg dat je je div's goed afsluit, zo nodig comment bij het sluiten van het div welke div je sluit zodat het duidelijk blijft voor jezelf

[mcDavid]

en als toevoeging op de twee posts hierboven even de link naar de W3-validator tool:
http://validator.w3.org/

Daar kun je checken of je HTML-code geen fouten bevat (let op: geen garantie dat je site goed weergegeven wordt, maar wel een goed begin)

[RobIII]

Kan iemand even...?
Wat heb je zelf al geprobeerd? Wat werkt(e) er niet aan? Heb je al gezocht? Iets gevonden? En als je code post, gebruik dan code tags. Dat maakt het een stuk leesbaarder.