Css nurdie gezocht o-o

Hoi

Ik heb een probleempje. Op http://shortsnel.nl/Razy/ingelogd.html heb ik 3 vakken onder elkaar (nu express zo). Ze moeten mooi naast elkaar gezet worden. Ook als ik later meer vakken eronder wil moeten ze niet gaan verschuiven als er in 1 vak meer tekst zit ofzo.

Html:

<div id="1" style="float: left"">
<div class="contentbalk_l"><img src="images/icons/house.png"> Welkom terug JanM</div>
<div class="contentmidden_l">
Tekst<br/ >
Tekst</div>
<div class="contentonder_l"></div>

<div class="contentbalk_l"><img src="images/icons/group_link.png"> Refferals</div>
<div class="contentmidden_l">
Tekst<br/ >
Tekst</div>
<div class="contentonder_l"></div>
</div>


<div id="1" style="margin-left: 210px;">
<div class="contentbalk_m"><img src="images/icons/user_comment.png"> Deel wat met je vrienden</div>
<div class="contentmidden_m">Tekst<br/ >Tekst<br/ >Tekst<br/ >
Tekst</div>
<div class="contentonder_m"></div>

<div class="contentbalk_m"><img src="images/icons/note.png"> Forum</div>
<div class="contentmidden_m">Tekst<br/ >Tekst<br/ >Tekst<br/ >
Tekst</div>
<div class="contentonder_m"></div>
</div>

<div id="1" style="float: right;">
<div class="contentbalk_l"><img src="images/icons/group.png"> Nieuwe leden</div>
<div class="contentmidden_l">
Tekst<br/ >
Tekst</div>
<div class="contentonder_l"></div>

<div class="contentbalk_l"><img src="images/icons/medal_gold_2.png"> Top 10</div>
<div class="contentmidden_l">
Tekst<br/ >
Tekst</div>
<div class="contentonder_l"></div>

</div>

CSS

.contentbalk_l {
    background: url(../images/contentbalk_l.png) no-repeat;
    width: 204px;
    height: 30px;
    padding-top: 15px;
    padding-left: 10px;
    color: #666666;
}

.contentmidden_l {
    background: url(../images/contentmidden_l.png) repeat-y;
    width: 204px;
    height: auto;
    padding-left: 10px;
    padding-top: 5px;
}

.contentonder_l {
    background: url(../images/contentonder_l.png) no-repeat;
    width: 204px;
    height: 11px;
}





.contentbalk_m {
    background: url(../images/contentbalk_m.png) no-repeat;
    width: 385px;
    height: 30px;
    padding-top: 15px;
    padding-left: 10px;
    color: #666666;
}

.contentmidden_m {
    background: url(../images/contentmidden_m.png) repeat-y;
    width: 385px;
    height: auto;
    padding-left: 10px;
    padding-top: 5px;
    margin-bottom: -1px;
}

Beloning bedraagt 1 hele punt !

float:left; toevoegen in de div waar het om gaat

Al geprobeert, probeer jij is anders?

Spoiler tonen

.contentbalk_l {
    background: url(../images/contentbalk_l.png) no-repeat;
    float:left;
    width: 204px;
    height: 30px;
    padding-top: 15px;
    padding-left: 10px;
    color: #666666;
}

.contentmidden_l {
    background: url(../images/contentmidden_l.png) repeat-y;
    float:left;
    width: 204px;
    height: auto;
    padding-left: 10px;
    padding-top: 5px;
}

.contentonder_l {
    background: url(../images/contentonder_l.png) no-repeat;
    float:left;
    width: 204px;
    height: 11px;
}





.contentbalk_m {
    background: url(../images/contentbalk_m.png) no-repeat;
    float:left;
    width: 385px;
    height: 30px;
    padding-top: 15px;
    padding-left: 10px;
    color: #666666;
}

.contentmidden_m {
    background: url(../images/contentmidden_m.png) repeat-y;
    float:left;
    width: 385px;
    height: auto;
    padding-left: 10px;
    padding-top: 5px;
    margin-bottom: -1px;
}

zoiets?? is ff snel gedaan, denk niet da het werkt, ik denk nog ff na

Dan krijg ik alles door elkaar.
//heb zelf wat geprobeert, het is aardig gelukt alleen wil die rechterkant niet lukken.

de divs te groot??

SLIMBO
Even proberen
//gelukt!