[résolu] 2colonnes de même hauteur indépendament du contenu [...]

Bonjour

on connait bien ce problème (topic précédent même !)
quand on a 2 ou 3 colonnes, on veut avoir la même hauteur pour toutes : bien.
lorsqu'on a 3 colonnes, on se base sur les float et la hauteur du #container, ca c'est bon, j'ai bien compris ^^
mais quand on a 2 colonnes, c'est un autre problème
je suis en dimension relative (on appelle ca fluide maintenant non ?)
bon déjà, je tiens à remercier Laurent Denis pour son merveilleux exemple : http://www.test.blog-and-blues.org/colonnes/
alors merci pourquoi ? parce que je me suis fais avoir comme un bleu lol je pensais que t'avais (vous aviez?) réussis à mettre les 2 colonnes à la même hauteur, mais nan, c'est juste le bgk:<color>; qui est de la même couleur pour le #container et #right ! bravo pour l'attrape-c******n
bref, passons cette histoire ^^

ce que je voudrais (mais que je n'arrive pas à faire), c'est avoir 2 colonnes de la même hauteur, et ceci indépendament du contenu de ces dernières
par exemple si la colonne de gauche a plus de texte, alors c'est celle de droite qui s'adapte (donc s'aggrandit) et inversement
ces 2 colonnes se trouvent dans mon #container, donc ce n'est pour un menu et autre chose, c'est juste une question de présentation et de style.

la solution proposé par Laurent Denis avec les display:table et table-cell est excellente, je l'utilisais déjà avant, mais ne convenant pas pour tous les navigateurs (en fait juste pour IE ... je l'aime celui là ), je les laissé de côté
je voudrais un code qui fonctionne partout, un code simple. pas de hack ou de bidouille pour annuler un truc sous IE ^^ (peut-on parler de code universel ? :o)

bon j'ose vous filer ma page maquette, qui me sert à tester plein de bazarre : http://hywan.firegates.com/new/index.php attention au design, il est de toute beauté
bref, c'est le code qu'il faut aller voir. surtout le style /new/layout.css (ligne 70 pour le code intéressant)
le code qui n'est pas commenté est l'actuel, qui fonctionne sous IE et les autres, mais ne fait pas ce que je veux. Celui qui est commenté est celui qui marche partout sauf sous IE (sauf que les 2 colonnes sont collées, mais ce n'est pas un problème, s'il n'y avait que ça )

Voila, alors j'ai essayé plusieurs choses
si on fixe une des deux colonnes, ou qu'on float l'ensemble, qu'on bidouille, qu'on truc ... mon probleme est assez spécifique, car la hauteur est en fonction des 2 colonnes, et pas que d'une ou de l'autre
je ne sais pas si vous saisissez la différence avec les autres problèmes "communs", mais moi si lol
ce genre de probleme est assez compliqué à expliquer, et en plus -- ce qui n'arrange rien -- je suis loin d'être doué pour ça :s

mais bon, si vous regardez la page et le css, et que vous essayez pas mal de chose, vous allez vite vous en rendre compte ^^

voila, un petit défi ?
laurent denis est imbattable paraît-il ? je l'espère (ca m'arrangerait personnellement lol -- hein on lance un défis histoire qu'on trouve hihi)
Modifié par HyWaN (28 Jul 2006 - 18:58)

Je veux bien aller voir tout ce qu'on veut, mais par pitié : une page test correcte (code minimal, styles en CSS interne, pas d'images ni de déco. Contenu également minimal, pour qu'on puisse y tester aisément du lorm ipsum déjà structuré. Voir l'exemple donné dans ce post ).

(Je ne suis ni imbattable ni quoi que ce soit, mais en revanche, j'ai autre chose à faire que débrouiller du code farfouille à l'heure du barbecue )
Modifié par Laurent Denis (27 Jul 2006 - 19:52)

hihi excusez moi
c'est vrai que c'est l'heure du barbecue, mais gaffe à l'orage hein ^^
je réécris une page ? (2mn)

Bonjour,

Je suis allé voir ton code, sans entrer dans le détail : tu utilises un display-table en retombant sur des flottants dans IE, ce qui est effectivement la solution classique. L'erreur de rendu dans IE ne pose pas de problème majeur à corriger. Il est possible de simuler les hauteurs identiques dans IE, et le passage des styles IE dans une CSS en commentaires conditionnels permettrait de faire cela proprement en conservant un code CSS très facile à gérer.

Mais pour t'aider plus précisément, il faudrait savoir quel est le résultat exact que tu souhaites obtenir. Une image pour en donner une idée ?
Modifié par Laurent Denis (28 Jul 2006 - 06:00)

alors j'aimerais éviter justement d'avoir à mettre des commentaires conditionnels, mais bon, essayons
si t'as la solution avec ça, je veux bien prendre, et puis après essayer de bidouiller
mon but est de faire un seul script, sans trop contournements et de bidouillages, j'ai toujours réussi jusqu'à maintenant, mais pour ce genre de script je commence à douter.

ce que je veux exactement, c'est que par exemple on a 2 colonnes (ici blog et galerie hein). si blog est plus grand que galerie, alors galerie s'aggrandit. si galerie est plus grand que blog, alors blog s'aggrandit. voila.
mais (!) tous les scripts existant qui font ce genre de choses sont avec 3colonnes (et je ne veux pas créer une colonne "vide") ou alors il fonctionne mais c'est juste 1 des 2 colonnes qui s'adapte, et pas les 2
moi je veux les 2 ^^

donc que dans n'importe quel cas (avec n'importe quel contenu), les 2 colonnes fassent la même hauteur, sous n'importe quel broswers ^^ simple

hehe voila le probleme est posé ?

je cherche encore, mais j'attend beaucoup de ce forum
Modifié par HyWaN (28 Jul 2006 - 14:28)

bah, il va falloir chercher un peu, alors.

Parce que la forme de ce sujet, pour tout te dire, n'est pas des plus agréables depuis le début.

Apparemment, quelque-chose t'échappe dans ce domaine actuellement. ça s'arrangera avec l'âge, je l'espère.
Modifié par Laurent Denis (28 Jul 2006 - 15:36)

lol désolé
c'est vrai que l'âge va jouer, mais le temps aussi; bref pardon et je vais faire un effort

sinon, par où chercher ?

Bon, j'explique deux ou trois petites choses.

Ton premier message: je n'ai proposé aucune solution. http://www.blog-and-blues.org/tests/ est un simple serveur de développement dont une petite partie est publique, à charge pour chacun d'en tirer ce qui l'intéresse. Il y a en ligne dessus beaucoup de choses périmées (je n'ai plus le temps de m'en occuper) et pas mal de sottises (des premiers jets). Mais ce sont des choses utiles, en général, pour qui peut les exploiter.

En revanche, on y trouvera pas de "précuit". J'ai cessé il y a déjà pas de temps de mettre en ligne des "templates" et des "gabarits", justement pour éviter ce type de malentendu sur le mode "je n'ai pas lu les avertissements de l'auteur, je veux un truc qui marche là tout de suite, je ne veux pas apprendre ni chercher ni savoir que c'est de la R&D ni ce que c'est que la R&D". Si quelque-chose sur ce serveur ne convient pas, il faut chercher ailleurs ou surtout développer soi-même. Si depuis j'ai développé mieux, je n'en parlerai pas nécessairement.

Pour le "défi", ça m'a franchement mis en rogne. Défi ? je suis un développeur professionel, je fais ça 12h par jour en moyenne; Là, je suis en vacances, je n'ai vraiment besoin qu'un petit con vienne me parler de "défi" sur des questions qu'il ne maîtrise pas. Parce que, oui, tu ne les maîtrises pas (sinon tu ferais un <table>, tu saurais ce que sont les commentaires conditionnels, etc.) et oui, tu es un petit con (le terme a quelque chose d'affectueux, si on veut).

Pour le "imbattable" aussi, ça m'a fichu en boule. Le développement CSS n'est pas un concours idiot à la "dreamteam". C'est un métier, en tous cas pour moi. Un métier où on gère beaucoup plus que de la technique CSS, dans le cas de mon travail : on gère le projet entier, on conseille sur la faisabilité, sur la stratégie, sur des choix insipides tels que ce bidule de même hauteur qui se résoud chez nous avec un <table>, point barre, quand on est en production pour des gens de métier.

Il faudrait sortir ce forum du trip des amateurs adolescents et passionnés, de temps en temps.

Sans compter que j'ai horreur d'être pris à partie personnellement.

Et qu'il y a quelque-chose qui s'appelle la politesse.
Modifié par Laurent Denis (28 Jul 2006 - 17:41)

a écrit :
donc que dans n'importe quel cas (avec n'importe quel contenu), les 2 colonnes fassent la même hauteur, sous n'importe quel broswers ^^ simple

hehe voila le probleme est posé ?

Ah oui, le problème est bien posé. Toi qui aime les défis, j'en ai un pour toi : essaie donc de m'expliquer pourquoi il y a autant de gens (autrement plus qualifiés que toi) qui se cassent les pieds à imaginer des méthodes plus biscornues les unes que les autres, alors que tu as l'air tellement certain qu'une méthode simple, propre (voire limpide puisque ne nécéssitant même pas de commentaires conditionnels) et universelle existe ?

En passant, une méthode qui te donne le rendu visuel que tu attendais, ce n'est pas un attrape-c******n, ça s'appelle une solution.

bon huhu, je crois qu'il y a eu une énorme confusion
déjà je ne suis pas un petit con hein ! faut pas me prendre pour une bille non plus :x

cette idée de défi était juste une petite blague (hein humour je précise ...), évidement que je ne vais pas lancer un défi, j'ai autre à faire, et je me fous de savoir qui va gagner. le dév c'est pas un concours, on est ok la-dessus

pour ce qui est du précuis, je n'en veux pas non plus, et mes scripts ne sont pas développés non plus dans cette optique. je veux que les gens cherchent, et comprennent; si on y arrive : hop c'est gagné.
donc ce n'est pas ce que je recherche, et sincèrement, je pense que vous l'avez mal prit, ok ... on se relaxe. vous avez raté votre barbecue ou quoi ? il y a eu de l'orage ?

bon après le petit con de la dreamteam a peine pationné, hmm jle prend moyen, et je ne parle pas de choses que je ne métrise pas. déjà parce que j'ai une certaine expérience en CSS, et que je connais les commentaires conditionnels, mais je ne les utilise pas. je cherche à faire un code sans conditions, quelques choses qui fonctionne partout sans forcer un code pour chaque cas.

concernant le "imbatable" c'était juste en rapport avec un topic où un admin vous avait dit "qui peut battre laurent denis", voila, un petit clin d'oeil, rien de bien méchant hein. on va pas s'engueuler pour si peu voyons, allons.

(et en passant, le comportement adolescent est loin derrière hein)

aussi, je ne vois pas en quoi j'ai été impoli, excusez-moi sinon.

on peut retourner sur mon probleme ? ou dois-je refaire une entrée sur ce forum (car apparement la premiere a été d'une grande maladresse -- involontaire ... --) ?
Modifié par HyWaN (28 Jul 2006 - 17:14)

Bon !

On se calme HyWaN, et on passe en mode courtoisie, sinon je ferme le sujet...

Merci d'avance

Edité : Pour complèter cette intervention, je dirais que l'humour est autorisé ici, à condition qu'il soit perçu comme tel par le ou les destinataires. Si tu te prends la tête avec des membres du forum ou des modos, tu n'as aucune chance de recevoir une quelconque aide, ce qui serait quand même dommage.
Modifié par dominique (28 Jul 2006 - 17:40)

(c'est moi ou ?)
je suis calme, mais je ne comprend pas le comportement ...
si j'ai été un peu fort avec l'attrape-couillon, j'm'en excuse hein, c'était pas voulu, juste une petite blagounette
mais me faire insulter tout de même ...

merci pour la politesse.

(j'ose encore parler de mon probleme ou je dois encore faire un plaidoyer ? )

HyWaN a écrit :
(c'est moi ou ?)
je suis calme, mais je ne comprend pas le comportement ...

L'humour passe très bien. Se faire charrier (et je le mérite souvent) passe aussi très bien. Mais pas tes messages. Cherche l'erreur.

En ce qui me concerne, quoi qu'il en soit, le sujet est clos.

La question était donc ? Je ne sais plus trop quoi. Toutes mes excuses aux membres du forum pour ce coup de gueule. Reportez-vous ci-dessus pour la question.
Modifié par Laurent Denis (28 Jul 2006 - 17:48)

bon on va oublié ça, on tourne en rond de toute façon.

Re.

Si tu veux une réponse claire à ta question, et si tu n'as pas saisi le sens de mon message précédent, la voilà :

à part en utilisant un tableau, il n'est pas possible d'avoir deux colonnes de même hauteur dans n'importe quelles conditions et avec n'importe quel navigateur sous n'importe quel OS et même quand il y a de l'orage à Tombouctou, sans avoir recours à des hacks ou des commentaires conditionnels (et même avec, puisque de toutes façons c'est le comportement qu'on attend d'un tableau, et d'aucun autre élément).

Remarque en passant : ne pas vouloir utiliser de hacks css ou autres est une attitude que je comprends et partage, car ils n'ont pas que des avantages. Par contre, en ce qui concerne les commentaires conditionnels, tu fais fausse route : c'est AMHA* la manière la plus propre de pallier aux déficiences d'IE dans l'immense majorité des cas.

edit : *et en l'occurence je ne pense pas être le seul.
Modifié par Sopo (28 Jul 2006 - 18:17)

hmm c'est ce que je pensais ... et si on laisse tombé IE pour une fois ? ^^
parce que avec un display:table et table-cell c'est nikel. D'ailleurs ça offre de grande possibilité, à quand IE 7 ?

bon, je vais me pencher sur les commentaires conditionnels apparement.

Merci pour la réponse @+ (si jtrouve un truc, jle poste)