Jump to content
Sign in to follow this  
gou

Positionnement absolu et texte intermittent

Rate this topic

Recommended Posts

Bien le bonjour!

Je me pose une question, à savoir si je suis le seul en ce bas monde à vivre ce problème:

j'ai un bloc en positionnement absolu dans une page (c'est le genre de positionnement que je n'utilise jamais, pas assez flexible et beaucoup de différences entre IE et le reste de l'univers). Ce bloc s'affiche très bien dans Mozilla (et Firefox), mais dans IE, j'ai un problème bizarre...

La boîte disparaît selon la taille des caractères (du plus grand au plus plus petit, elle disparait à la moyenne et aux extrêmes). J'ai testé en enlevant la propriété

position:absolute;

dans ma CSS, et le bug ne se produit plus.

Je suis vraiment perplexe... La boîte ne se déplace pas, elle disparait, tout simplement. Et ce n'est pas comme le classique problème des multiples float qui disparaissent en scrollant et réapparaissent en sélectionnant le texte...

Si quelqu'un a une piste...

Share this post


Link to post
Share on other sites

Comme je l'ai dis y'a pas si longtemps, IE se perd entre les bloc à position absolu et le reste, du coup ... il efface !

Pour "corriger" le problème, il faut donner aux éléments une position relative, ce qu'ils devraient avoir normalement :

div,h1,h2,h3,p { position: relative; }

Au tout début de ta CSS

Share this post


Link to post
Share on other sites
Pour "corriger" le problème, il faut donner aux éléments une position relative, ce qu'ils devraient avoir normalement :

div,h1,h2,h3,p { position: relative; }

Au tout début de ta CSS

Hum... peux-tu préciser un peu le "ce qu'ils devraient avoir normalement" ? Je ne suis pas sûr qu'il y ait un bug d'IE dans ce cas (ou alors, je l'ai loupé, celui-là ;) )

En effet, normalement, c'est à dire par défaut, les éléments n'ont pas de positionnement : ils sont en flux. Tous les navigateurs, y compris IE, respectent cette règle.

(Les positionnements (absolu, fixe) et le float consistent justement à extraire le bloc concerné du flux.)

D'autre part, le positionnement absolu (et le fixe) ont une règle souvent oubliée :

- par défaut, le bloc est positionné par rapport au bloc conteneur initial, c'est à dire en pratique la fenêtre d'affichage du navigateur.

- pour le positionner dans les limites d'un autre bloc conteneur, il faut que ce dernier soit lui-même en position relative (sans forcément être déplacé, donc éventuellement sans mention de top: ni de left:...)

Il arrive souvent que l'oubli de ce position:relative à appliquer au bloc conteneur provoque des rendus suprenants et déroutants ;)

Edited by LaurentDenis

Share this post


Link to post
Share on other sites
La boîte disparaît selon la taille des caractères (du plus grand au plus plus petit, elle disparait à la moyenne et aux extrêmes). J'ai testé en enlevant la propriété
position:absolute;

dans ma CSS, et le bug ne se produit plus.

Gou, peux-tu donner une url vers le code source ? ce sera plus facile ;)

Share this post


Link to post
Share on other sites
Gou, peux-tu donner une url vers le code source ? ce sera plus facile

Hummm... j'ai mis le code et la css sur un site perso temporairement... Pour voir ce dont je parle, il faut agrandir et réduire la taille du texte (ctrl-roulette sur PC) dans Internet Explorer. Vous allez voir du texte en haut à droite (c'est écrit «Profil» et «Accueil des services»).

Je ne suis vraiment pas friand du positionnement absolu... mais la mise en page n'est pas de moi, je dois faire avec...

Merci si vous trouvez une solution!

(je vais continuer à plancher là dessus...)

Share this post


Link to post
Share on other sites

Bonjour,

Je pense que la réponse de Laurent pointe bien vers la cause du problème

- pour le positionner dans les limites d'un autre bloc conteneur, il faut que ce dernier soit lui-même en position relative (sans forcément être déplacé, donc éventuellement sans mention de top: ni de left:...)

IE comprend que le bloc "profil" est positionné par rapport au conteneur initial (la fenêtre du navigateur).

Findel avait raison aussi.

Essaie en précisant l'attribut position:relative; pour l'élément qui contient le bloc "profil"

Share this post


Link to post
Share on other sites

Problème réglé... du moins, en partie!

Merci de vos conseils, ça m'a mis la puce à l'oreille... surtout cette phrase de Findel:

Comme je l'ai dis y'a pas si longtemps, IE se perd entre les bloc à position absolu et le reste, du coup ... il efface ! (sic)

Éloquent!

J'ai corrigé le tir en positionnant mon bloc en relatif plutôt qu'en absolu. De cette façon, IE semble avoir moins de réticences à l'afficher. Par contre, c'est nettement plus complexe de le positionner au bon endroit... un jeu de marges négatives et de top ou de right...

Il semblerait que même de positionner mon bloc conteneur en relatif n'ait pas été suffisant...

Maintenant de peux passer aux autres problèmes! argh! pourquoi IE??

*soupir!*

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×
×
  • Create New...