Help?

Hi,

In me layout wil ik aan de linker kant meerderen vakken krijgen.
Als er 1 staat is het gwn goed maar als ik er 2 neer zet (dus de div 2 keer neer zet)
krijg ik dit:

Spoiler tonen

ik wil dus dat die 2 vakken (links) onder elkaar komen en content enzo in het midden.

html:

<div class="left"> 
<div class="vak">
<div class="top"><h2>Laatste Nieuws</h2></div>
<div class="center">
[HF] We zijn online! <BR>
[HF] We zijn online!<BR>
[HF] We zijn online!<BR>
[HF] We zijn online!<BR>
[HF] We zijn online!<BR>
[HF] We zijn online!<BR>
[HF] We zijn online!
</div> 
<div class="bottom"></div> 
</div>
</div>

<div class="left"> 
<div class="vak">
<div class="top"><h2>Laatste Nieuws</h2></div>
<div class="center">
[HF] We zijn online! <BR>
[HF] We zijn online!<BR>
[HF] We zijn online!<BR>
[HF] We zijn online!<BR>
[HF] We zijn online!<BR>
[HF] We zijn online!<BR>
[HF] We zijn online!
</div> 
<div class="bottom"></div> 
</div>
</div>

css

.left {
   float: left;
   text-align: left;
   width: 197px;
   margin-left: 13px;
   margin-top: 5px;
}

.left .top {
   background: url(images/box_left_top.PNG) no-repeat;
   width: 197px;
   height: 31px;
}

.left .top h2 {
   color: #FFFFFF;
   font-weight: bold;
   font-size: 11px;
   padding: 7px 0 0 9px;
}

.left .center {
   background: #FFFFFF;
   width: 185px;
   border-left: 1px solid #C6C4B9;
   border-right: 1px solid #C6C4B9;
   padding: 4px 5px 2px 5px;
}

.left .bottom {
   clear: both;
   background: url(images/box_left_bottom.gif) no-repeat;
   height: 6px;
   width: 197px;
   margin: 0 0 14px 0;
}

alvast bedankt!!

Nvm werkt niet

Nee zo doet hij het ook niet

css, voeg deze toe an je css:

#container {
   width:  700px;
   height: 900px;
   margin: 0px auto;
}

html

<div id="container">
HIER ALLE ANDERE DIVS ENZOVOORT
</div>

Hmdesign schreef:

Allemaal codes hier inhoegen

Na das ut niet

@TS Je hebt

Tnx