Bonjour,
Je me trouve face à un cas que ne ne parviens pas à resoudre. J'ai une div dont le contenu est variable, donc sa hauteur aussi, et qui se trouve en position absolute, collée au bottom de la page. Le problème est que suivant la taille de son contenu, cette div vient empiéter sur les éléments du dessus qu'elle ne parvient pas à chasser. Un margin-top sur cette div bottom part dans les airs sans affecter en aucun cas la div du dessus. Suis-je clair ? Que faire ? Je vous montrer la strcture de ma page et son css.
Un exemple ici où je résouds le problème comme un gros bourin avec un spacer.
Si quelqu'un à une solution, moi je trouve pas…
Merci !
tu parles bien de la div .contenu--colleft--pavebas ?
Comme elle n'est pas en float, elle n'est pas dans le même flux que les autres !!!
Merci de m'avoir mis sur la piste, c'est résolu. Il suffisait de supprimer la position absolute après avoir passé la div en float et c'est bon !
Non, j'ai parlé trop vite. En fait ça ne résoud le problème qu'à moitié, seulement dans le cas ou la colone de gauche est plus grande que la colone de droite, dans le cas contraire ma div pavebas décolle. Voici deux exemples :
Colonne de gauche suffisament haute
Colonne de droite avec plus de contenu qu'à gauche
Si tu la mets en position: absolute, elle repasse en bas
dans ce cas, tu as le margin -30px à régler
Oui, c'est ce que j'avais fait au début, mais du coup ça ne fonctionne pas dans le premier cas.
Pas simple isn't it ?
Et simplement position:relative float:left et margin-top: 100%
Et non, malheureusement toujours pas. Si la colonne de droite s'agrandie, le pavé perd pieds… :/
En fait c'est compliqué parce qu'il faut que la colonne de droite pousse sur le bas du contener où est accroché le pavebas, et il faut en même temps que la colonne de gauche pousse sur le haut du pavebas. C'est la le casse-tête. Mais il y a peut-être un autre moyen de réaliser ça, je suis peut-être partir sur une mauvaise piste, c'est pour ça que je demande de l'aide de personnes avec un peu de recul…
En fait, je pense que le seul moyen c'est de récuper la hauteur de mon pavebas (qui est variable je le rappelle) et donner cette valeur (+20 px) au margin-bottom de l'élement qui est juste au dessus. Ça se fait en javascript ça ?
moi je voudrais bien t'aider cependant, je ne comprends pas bien quel est ton problème exactement !
Merci cacoua, finalement je crois avoir trouvé une solution mais c'est du javascript et je ne suis pas à l'aise avec ça. Je veux récupérer la hauteur d'un div et renvoyer cette valeur au style margin-bottom d'un autre élément. Pour l'instant, j'ai ça :
Mais ça ne marche pas…
si tu ne m'expliques pas clairement quel est ton problème, je ne pourrais pas t'aider.
Avant de s'aventurer dans je ne sais quel bidouillage via js ou autre, voyons clairement ce qui pose problème pour trouver la solution la plus adéquate possible !
si tu ne m'expliques pas clairement quel est ton problème, je ne pourrais pas t'aider.
Il a créé un autre sujet pour son problème : Javascript » Changer une valeur d'un attribut en javascript.
Et son problème est résolu.
merci pour l'info Lartak
Bonne soirée
Bonsoir caoua,
En effet, j'ai déménagé avec la suite du problème vers le forum javascript car la solution semblait venir de là. Je pense que les détails mon problème étaient bien expliqués et détaillés au début de ce fil avec en plus des liens vers les pages en ligne pour voir exactement de quoi il s'agissait. Désolé si je n'ai pas été assez clair. Je ne vois pas comment j'aurais pu expliquer mieux.
Merci Lartak pour ta vigilance.
Bonne soirée et merci de ton aide.