Bonjour la communauté, je fais face à un petit problème d'HTML/CSS au niveau d'une table. J'en appel à vos compétences :)

Voici mon problème :
J'ai une table dans lequel j'ai plusieurs TD. Ces TD n'ont pas de hauteur fixe. A l'intérieur de ces TD je souhaiterais avoir deux div : une positionnée en top et l'autre en bottom afin d'avoir un alignement parfait entre les TD

Lien Jsfiddle

En photo voici ce que je voudrais obtenir en css si possible car j'ai déjà trouvé une solutions en JS mais qui prend pas mal de ressources

https://photos.google.com/photo/AF1QipOLrlGZy2xoCzO_H-yIuLhsUnz3y5lOLi4-_lxb!

Merci pour vos lumières

6 réponses


Salut,

Une solution serait de mettre le container des 2 div (top et bottom) en position: relative,
ensuite tu mets les 2 divs enfants (top et bottom) en position: absolute,
et pour la div "top", tu lui rajoutes top: 0,
et pour la div "bottom", tu lui rajoutes bottom: 0

PS : j'ai une erreur 404 sur le lien google.

Merci SLK pour ta réponse rapide. J'essaye cela mais il me semble déjà avoir testé
Voici le lien de la capture d'ecran de ce dont j'aimerais arriver à faire

http://imageshack.com/a/img923/8666/UlqbFu.jpg

Malheureusement ta solution ne marche pas... je commence à penser que c'est impossible :)

[]()https://jsfiddle.net/67qopcv6/3/

Mince,

ah oui, j'ai essayé, je vois le problème...

Alors zut, désolé je ne sais pas comment faire,
sauf en utilisant les flex-box, comme ceci :
https://jsfiddle.net/j8w1xbep/3/

Peut-être que quelqu'un d'autre saura te proposer une solution sans les flex-box.

Hello,

Voici une solution : https://jsfiddle.net/017fzfwg/
Un tableau dans un tableau.
J'espère que c'est pour un emailing et non pour positionner tes contenus ! ;)

Est-ce que tu peux fixer la hauteur des divs qui se trouvent en bas du bloc ?
Si oui, une proposition : https://jsfiddle.net/67qopcv6/7/