Float: left; et float: right; combinés

Bonjour,

J'ai cinq div qui se suivent contenants des titres, paragraphes, images, etc...

Je souhaite pouvoir les positionner facilement en css sans toucher au xhtml :

<div id="p1">
 <p>texte</p>
</div>

<div id="p2">
 <p>texte</p>
</div>

<div id="p3">
 <p>texte</p>
</div>

<div id="p4">
 <p>texte</p>
</div>

<div id="p5">
 <p>texte</p>
</div>

Je sais en mettre deux ou trois côte à côte et les autres en dessous par exemple :

#p1, #p2 , #p3 {
 float: left;
 margin : 5px;
 padding : 0;
 border: 0;
 width: 150px;
 background: #ccc;
}

#p4 {
 clear: both;
}

Ce que je n'arrive pas à faire c'est en mettre trois flottants à gauche, comme dans l'exemple ci dessus, puis un flottant à droite et le dernier viendrait prendre place en dessous des trois du dessus, ... un dessin c'est mieux



J'avais pensé à quelque chose comme çà, mais c'est pas bon !

#p1, #p2 , #p3 {
 float: left;
 margin : 5px;
 padding : 0;
 border: 0;
 width: 150px;
 height: 50px;
 background: #ccc;
}

#p4 {
 float: right;
 margin : 5px;
 padding : 0;
 border: 0;
 width: 150px;
 height: 100px;
 background: #ccc;
}

#p5 {
 margin : 5px;
 padding : 0;
 border: 0;
 width: 450px;
 height: 50px;
 background: #ccc;
}

Merci pour vos lumières, explications, ... solutions juste pour rire : sur I.E. on y croirait presque, mais je voudrais que cela soit ok sur FF. et Safari
Modifié par jaas (30 Nov 2005 - 11:50)

tu t'es pas gourré de salon par hazard!!!

Désolé,

Comment fait-on pour changer de salon ?

jaas a écrit :
Désolé,

Comment fait-on pour changer de salon ?

C'est déplacé