28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Deux colonnes, l'une de fond orange, l'autre de fonc blanc. Elles sont côtes à côtes, chacune dans des "div" avec des "float: right;"
Je voudrais que la colonne la plus courte suive la hauteur de la plus grande afin que le fond orange s'agrandisse lorsque le texte sur fonc blanc est grand.
C'est facile avec des tableaux, avec des CSS, je ne trouve pas la solution…

Le problème est visible :
http://test.avicca.org

Merci d'avance
Felipe a écrit :
as-tu consulté la FAQ: Comment faire des "colonnes" de même hauteur ?

Je l'ai fait et je retombe sur un problème qui m'ennuie fort:

1) la solution proposée à l'adresse /css.alsacreations.com/Modeles-de-mise-en-page-en-CSS suppose que l'on sache quelle est la colonne la plus courte.

2) les colonnes factices http://pompage.net/pompe/colonnesfactices/ supposent que la taille de la largeur de la colonne latérale soit fixée en pixels (et non en % ou en em).

Mais si :
(1) je ne sais pas, comme Pascale, quelle est la colonne la plus longue,
et si (2) la largeur des colonnes n'est pas fixe,
alors, à ma connaissance, je suis coincé.


a) Je ne sais alors me débrouiller qu'en introduisant une table minimale (juste 2 cellules comme bloc conteneur), stylée proprement certes, mais utilisant malgré tout une table pour la mise en page sans respecter la sémantique de cet élément. Les spécifications actuelles ont des manques, et en attendant l'avènement des CSS3, on est parfois (rarement heureusement) conduit à de tels compromis.

b) A moins d'entrer dans ce que je considère comme des usines à gaz qui tirent les standards par les cheveux. Exemple:


#block_1, #block_2, #block_3
{
padding-bottom: 32767px;
margin-bottom: -32767px;
}

suivies de considérations (longues) sur tous les cas particuliers où des navigateurs ne savent pas faire ce truc.

voir: http://www.positioniseverything.net/articles/onetruelayout/equalheight

c) Une autre alternative, très répandue, consiste à concevoir sa mise en page en évitant les cas qui posent problèmes, mais on soumet alors sa mise en page à ce que l'on sait faire en respectant les standards et en composant avec ce que savent faire, dans ces standards, les principaux navigateurs.

Si quelqu'un connaît une sortie à cette impasse, il me serait d'un grand réconfort et d'une aide précieuse à Pascale!

Philippe (phdm)
Modifié par phdm (13 Apr 2006 - 09:33)