[Résolu] Position: relative

Bonsoir à tous,

Une petite question, car je n'avais pas remarqué avant... J'ai ce type de structure HTML :

<article>
<section>
<h3>mon titre</h3>
<p></p>
<p></p>
<p></p>
</section>
</article>

Si j'applique un position:relative dans mon CSS sur une balise <p> (une, pas toute), pour ensuite la 'remonter' avec la propriété 'top'. Il reste un espace vide, en fait, la balise occupe l'espace comme si elle était là. Je suppose que c'est tout à fait normal comme comportement. Mais n'y a t'il pas un moyen pour éviter cela ?

Merci pour vos éclaircissement. Je tiens à dire que j'ai lu plusieurs fois l'article sur ce site concernant le positionnement. Mais comme je l'ai dis aussi dans ce post, je n'avais pas remarqué ça comme ça. A moins que j'ai complètement fumé de la drogue sans m'en rendre compte mais là, c'est un autre sujet
Modifié par MagicCarpet (03 Jan 2013 - 22:02)

MagicCarpet a écrit :
Il reste un espace vide, en fait, la balise occupe l'espace comme si elle était là. Je suppose que c'est tout à fait normal comme comportement. Mais n'y a t'il pas un moyen pour éviter cela ?

Si c'est pour éviter qu'il y ait un espace vide, alors donner à p la position:absolute. Par contre P sort du flux...

rodolpheb a écrit :


Si c'est pour éviter qu'il y ait un espace vide, alors donner à p la position:absolute. Par contre P sort du flux...

Oui alors justement, tu fais bien de me le dire
Parce que j'ai essayé le absolute. D'ailleurs si je n'avais pas remarqué ce phénomène avant avec le relative c'est que mon site utilise du absolute.

Mais par contre, dans ce cas, décris plus haut ma balise <p> disparait... Je veux dire, je sais pas où elle se trouve ! Aurais-tu une explication ? (ou une idée)

Lorsque le P est positionné en absolute il se place par rapport au dernier parent positionné.

Pour repérer la balise p l'idéale est de positionner le parent en relative.

Si vous ne comprenez je vous poste un exemple.

Ce sont des notions à bien assimiler pour éviter les bidouillages.

Non super, j'ai compris, testé et vérifié !!! C'est parfait, merci