Проблем с разположение на <div>

[stoqnski]

Здравейте , DIV [3] има width: 600px;
искам в този да влизат съоветно DIV [1] отляво и DIV[2] отдясно като при преминаване на нов ред с <br /> и отново отваряне на <div class="1" > и <div class="2"> отново да си излизат единия вляво , другия вдясно ..
имам следния код :
<div class="te3">
<div class="te1">content</div><div class="te2">content2</div>
<div class="te1">content</div><div class="te2">content2</div>
</div>

Пробвах с float: left за .te1 и float:right; за .te2 , но се получават някакви глупости и не мисля , че ще стане така
към .te3 имам изисквание да е с width: 600px , а към .te1 и .te2 width: 250px или 300px да е пропорционално

Надявам се да ми помогнете

*Знам , че може с таблица с 3 реда код, но трябва да го направя с div .

 

[lubo91]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<style type="text/css">

.te3
{
width:600px;
height:800px;
background: red;
}

.te1
{
float:left;
width:290px;
height:600px;
background:blue;
margin: 5px 0 0 5px;
}

.te2
{
float:left;
height:600px;
width:290px;
background:green;
margin: 5px 0 0 5px;
}

</style>

</head>

<body>
		
	<div class="te3">
		<div class="te1">content</div>
		
		<div class="te2">content2</div>
		
		<div class="te1">content</div>
		
		<div class="te2">content2</div>
		
		<div class="te1">content</div>
		
		<div class="te2">content2</div>
	</div>
</div>

	
</body>

</html>