captain_torche Posté 12 Janvier 2011 Partager Posté 12 Janvier 2011 Dans une page, je dois placer un sous-élément en bas de son élément parent. Je le place en absolu, et tout fonctionne bien, sauf la largeur de l'élément, qui se comporte maintenant comme s'il était de type inline. Un width: auto; ne fonctionne pas, et un width: inherit; le fait fatalement dépasser du conteneur parent, la faute au padding. Je ne peux pas spécifier de largeur en pixels, le bloc parent ayant une taille variable. Idéalement, j'aimerais éviter d'avoir à utiliser une balise supplémentaire, qui aurait une taille en inherit sans padding. Comment faire pour pallier à ce souci ? Lien vers le commentaire Partager sur d’autres sites More sharing options...
Ernestine Posté 12 Janvier 2011 Partager Posté 12 Janvier 2011 Salut Captain, La seule solution que je vois, ce serait d'attribuer background: url(rouge.gif) left bottom repeat-x; au conteneur, où "rouge.gif" est une image rouge de 1 pixel de large, de façon à "simuler" une ligne en bas du conteneur. Mais ça t'oblige à utiliser une image, et cela ne te convient peut-être pas. A part ça, je ne vois pas d'autres solutions... Lien vers le commentaire Partager sur d’autres sites More sharing options...
captain_torche Posté 12 Janvier 2011 Auteur Partager Posté 12 Janvier 2011 Merci pour l'astuce, j'attends de voir s'il existe d'autres moyens et je finirai par l'utiliser si je n'ai pas d'autre choix. Par chance, la hauteur de cet élément est fixe. Lien vers le commentaire Partager sur d’autres sites More sharing options...
mick38 Posté 12 Janvier 2011 Partager Posté 12 Janvier 2011 Et un "overflow: hidden" sur le bloc parent, ça peut peut-être marcher ? Lien vers le commentaire Partager sur d’autres sites More sharing options...
mick38 Posté 12 Janvier 2011 Partager Posté 12 Janvier 2011 Quoique ca risque de rogner du texte à l'affichage si le contenu est juste à la limite du "trop long" Lien vers le commentaire Partager sur d’autres sites More sharing options...
mick38 Posté 12 Janvier 2011 Partager Posté 12 Janvier 2011 Une autre option, qui semble fonctionner en tout cas sur FF et Safari : p { padding: 2% 5%; margin: 0; } #p_auto{ width: 90%; } Lien vers le commentaire Partager sur d’autres sites More sharing options...
captain_torche Posté 12 Janvier 2011 Auteur Partager Posté 12 Janvier 2011 La seconde solution ne peut pas fonctionner : j'ai des marges fixes, et une largeur totale variable. Par contre, la première était la bonne, merci ! Lien vers le commentaire Partager sur d’autres sites More sharing options...
MarvinLeRouge Posté 13 Janvier 2011 Partager Posté 13 Janvier 2011 STOP ! Arrêtez de vous prendre la tête, j'ai trouvé : c'est juste le padding 5px sur les p qui s'appliquait aussi à ton #p_inherit, du coup, quand tu lui donnais un width inherit (ou 100%), il se retrouve à occuper 100% de son parent + 10px. Essaye ça : #p_inherit2{ width : 100%; padding : 5px 0;} Lien vers le commentaire Partager sur d’autres sites More sharing options...
captain_torche Posté 13 Janvier 2011 Auteur Partager Posté 13 Janvier 2011 Effectivement, mais j'ai quand même besoin du padding Lien vers le commentaire Partager sur d’autres sites More sharing options...
Sujets conseillés
Veuillez vous connecter pour commenter
Vous pourrez laisser un commentaire après vous êtes connecté.
Connectez-vous maintenant