Plusieurs div dans un même div ?

Bonjour,

Comment mettre plusieurs div dans un même div ?? Je ne sais en mettre que deux: un à droite et un à gauche. Je vaudrais, de la même manière, en rajouter dessous. Quand j'essaye ceci, si sa contenance est petite, il se place entre les deux premiers, sinon il se met en dessous mais complètement collé aux autres; alors que moi je voudrais qu'il se mette directement en dessous, et de plus, qu'il y ait un espace avec celui du dessus, puis qu'il "descende" en même temps que ce dernier s'il devient plus long. J'espère avoir été claire, voici pour l'instant mon code de mes deux div dans mon div :

code css :

#souscadregauche
{
padding-left: 10px;
padding-right: 10px;
background-color:#3399FF;
float : left;
margin-left: 4%;

}

#souscadredroit
{
padding-left: 10px;
padding-right: 10px;
background-color:#3399FF;
float: right;
margin-right:4%;

}


code html :

<div id="principal">

<div id="souscadregauche">
...
</div>

<div id="souscadredroit">
...
</div>

</div>