[resolu] Design qui tombe

Bonjour,

j'essaie de refaire "pour le fun" ce site :

http://www.paris.fr/portail/Culture/Portal.lut?page_id=145

On a en gros quatre blocs :

le header (pas de souçis, à base d'image flottantes)

le menu gauche (float: left et width: 14em)

le menu droit (float: right et width:12em)

le conteneur central ( float : left et width:70% )

Tout marche bien en 1024 mais quand je redimensionne en 800*600,
le conteneur central tombe sous les flottants.
Pour que ça passe bien en 800*600 il faut que je donne 60% au conteneur mais dans ce cas là c'est bcp trop étroit en 1024.

Si vous avez une idée, je vous remercie d'avance

ps: si vous avez un lien qui se rapporte à cette situation je suis aussi preneur!
Modifié par gauguin (21 Mar 2006 - 20:40)

Si on veut :
– colonne de gauche de 160px
– colonne de droite de 160px
– partie centrale prenant tout l'espace disponible sauf 20px de marge de chaque côté.

On fait comme ça :
– en premier dans le code, les deux colonnes (l'ordre n'est pas important), l'une en float: left et l'autre en float: right;
– en deuxième, le conteneur central. Celui-ci n'est pas flottant (on reste en positionnement statique) mais est doté de marges de 180px à gauche et à droite.

Et le tour est joué.

En général, pour avoir deux colonnes, il suffit d'avoir un seul flottant. Pour avoir trois colonnes, il suffit d'avoir deux flottants. En jouant avec des flottants ayant une largeur fixe et sur des marges pour l'élément statique, on évite bien des problèmes de flottants qui ne tiennent plus dans la largeur alouée (et passent à la ligne).
Modifié par mpop (21 Mar 2006 - 22:30)

Merci bcp, je vais essayer ça.
Modifié par gauguin (22 Mar 2006 - 08:05)