Forum d'entraide PHPFrance

Bonjour,

La réponse est certainement toute simple,
mais en ce moment, j'ai la crève
et les neurones trop englués (Bâââh...) pour trouver tout seul.

Voici donc ma page :
(oui, j'ai arrêté le HTML pour coder directement en ASCII !) Pour des raisons absolument dépendantes de ma volonté,
les div GAUCHE et DROITE sont placés en position:absolute.

Le souci est que le div BAS doit se placer en dessous
(GAUCHE et DROITE sont de hauteur variable).

Or, BAS a tendance à se coller en-dessous de HAUT
se superposant ainsi à GAUCHE et DROITE.

Et ça m'agace.

Une idée ?
D'avance, merci.

// CSS épuré (j'ai viré les trucs inutiles : backgrounds, etc.)

#haut   { height:191px ; margin:0 ; padding:0 ; }
#gauche { position:absolute ; top:191px ; left:0 ; width:210px ; margin:0 ; padding:0 ; }
#droite { position:absolute ; top:191px ; left:210px ; width:540px ; margin:0 ; padding:0 ; }

#bas    { POSITION:RELATIVE ; height:272px ; margin:0 ; padding:0 ; }

faut virer les positions absolues de gauche et droite. Mettre un float: left sur gauche, mettre un clear:both sur le bas.

Pour t'orienter, tu as ça :

http://css.alsacreations.com/modeles/modele3.htm

Pour des raisons absolument dépendantes de ma volonté,
les div GAUCHE et DROITE sont placés en position:absolute.

Je vais donc préciser...

Initialement, j'utilisais des float.
Les 4 éléments étaient bien placés les uns par rapport aux autres.

Sauf... quand on réduisait la largeur de la fenêtre d'affichage,
DROITE venait se placer en dessous de GAUCHE.
Ce que je ne veux surtout pas !

Voilà pourquoi, j'ai opté pour les position:absolute.

Mais résoudre un problème en provoque souvent un autre...

En me référant au modèle proposé par alsacréations dont tu m'as rappelé le lien,
j'ai retrouvé l'astuce du margin-left.

Le positionnement est à présent correctement rétabli,
mais j'ai un problème de continuité qui est apparu (espace de rupture de qqs pixels)

je teste...

Si tu tiens au positionnement absolu, il faut un élément englobant l'ensemble de la page et positionné (un simple position: relative suffit, je pense). Ainsi, tu pourras positionner en absolu ton élément du bas avec bottom: 0. Sauf erreur de ma part.

Mais, d'un autre côté, pourquoi faire compliqué quand les marges et le positionnement flottant (ainsi que l'annulation de ses effets) font très bien l'affaire?

Initialement, j'utilisais des float.
Les 4 éléments étaient bien placés les uns par rapport aux autres.

Sauf... quand on réduisait la largeur de la fenêtre d'affichage,
DROITE venait se placer en dessous de GAUCHE.
Ce que je ne veux surtout pas !

Mais s'il y a une autre solution que de passer en position:absolute, je suis preneur !

le positionnement flottant (ainsi que l'annulation de ses effets)

Genre "empêcher la linéarisation" ?
Parle-moi, je t'écoute...

Sujet poursuivi ici