Problème de div

Bonjour,
voilà mon problème: j'ai insérer 2 <div> dans une,
et pas moyen de mettre les deux à l'intérieur côte à côte.
donc si quelqu'un aurait la soluce ... ^^ merci bien.

un exemple:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
<!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" xml:lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<style>
body {margin: 0px;padding: 0px; font-family:Verdana,Arial, Helvetica, sans-serif;}
#principal{ width:800px;}
#div1 {float:left; background-color:#FF6600; width:200px;}
#div2 {float:left;background-color:#0066CC;width:200px;}
	</style>
</head>
 
<body>
	<div id="principal">		
		<div id="div1">			
            bla<br />
            bla<br />
            bla<br />
            bla<br />
            bla<br />
            bla<br />
            bla<br />
		</div>
		<div id="div2">			
            bla2<br />
            bla2<br />
            bla2<br />
            bla2<br />
            bla2<br />
            bla2<br />
            bla2<br />				
		</div>
	</div>
</body>
</html>

c'est les float qui font tout
;)

ça fonctionne merci bien :)