Placer une paragraphe au bas d'une div

Par Meuhfin, il y a 10 ans


Les bases HTML/CSS

Bonsoir à tous,

Je suis en train de m'acharner depuis quelques temps sur ce point là, je n'arrive pas à placer un paragraphe au bas d'une div. En gros, je voudrais dire à mon pragraphe : Tu le places à 5px du bottom.

Voici déjà ce que j'ai fait :

.col_1-4{ width: 252px; height: 224px; float: left; border-left: 1px solid rgba(255,185,0,0.5); } p{ display: block; position: relative; text-align: center; color: #d4d4d4; font-size: 0.7em; margin: 5px 0; bottom: 0; }

Voilà donc mon problème. Merci d'avance pour vos solutions.

Meuhfin

4 réponses

Sankaman, il y a 10 ans

Afin que ton paragraphe soit toujours placer en bas de ton conteneur, tu peux mettre ce dernier en "position: relative", puis mettre le paragraphe en "position:absolute". Tu pourras alors placer ton paragraphe en fonction du conteneur.
J'ai fait un JSFiddle pour que tu vois :
https://jsfiddle.net/Sanka/1v3w48yp/

En espérant t'avoir aider ;)

Meuhfin, il y a 10 ans

Franchement merci, tu as résolu, mon problème :), mais un autre vient de survenir en règlant ce problème. Malgré mon text-align: center, le contenu n'est plus centré

Sankaman, il y a 10 ans

Tu peux rajouter "width: 100%" à ton paragraphe afin qu'il prenne toute la largeur. Lors du passage en absolue, ton paragraphe ne prend plus tout la largeur du bloc mais seulement la place nécessaire à l'affichage.

Ton bloc prendra, dans ce cas là, toute la largeur du bloc. Si tu ne veux pas que cela soit le cas, tu peux centrer horizontalement le paragraphe, il y a un tuto pour cela : http://www.grafikart.fr/tutoriels/html-css/centrer-css-614

Meuhfin, il y a 10 ans

Franchement, merci d'avoir résolu mes deux problèmes ;)