Bonjour,
je me heurte à un petit mystère avec un problème de positionnement de blocs ayant des types de positionnement différents.
Schématiquement, j'ai ceci :
C'est très schématique, mais bon, j'ai un formulaire, mis en forme par CSS avec pour chaque ligne un label, un champ et une info-bulle à droite. Cette info-bulle est par défaut masquée et ne s'affiche que si le focus est dans le champ de cette ligne ou si on clique sur la ligne (<p>) La ligne est positionnée en "relative", l'info-bulle en revanche est en "absolute" puisqu'elle est positionnée pour cette ligne-ci.
À un endroit de mon formulaire, j'ai une phrase explicative dans une ligne, phrase qui occupe une largeur suffisante pour terminer là où se trouve une partie de l'infobulle de la ligne précédente. Avec un z-index approprié, cette info-bulle s'affiche bien par dessus la phrase en question, comme on peut voir dans mon graphique ci-dessus... sous Firefox. Mais sous IE, la bulle se glisse en dessous de la phrase comme ceci :
J'ai tenté d'indiquer explicitement un z-index inférieur à ladite phrase, mais il n'y a rien à faire et le texte reste par dessus mon info-bulle.
Qu'est-ce que j'ai loupé ??
Sous Firefox, aucun problème, tout fonctionne très bien
Modifié par Cyrano (13 Jun 2008 - 15:29)
je me heurte à un petit mystère avec un problème de positionnement de blocs ayant des types de positionnement différents.
Schématiquement, j'ai ceci :
Exemple Firefox
+--------------------------+ +-----------------------+
Un label |un champ de formulaire | |< Une info-bulle |
+--------------------------+ +-+ avec du texte et |
+--------------------------+ | des explications |
autre label | autre champ | | aussi diverses |
+--------------------------+ | que variées comme |
| aide à l'internaute |
Ici une phrase explicative quelconque d'inf+---------------------+ ou aide
C'est très schématique, mais bon, j'ai un formulaire, mis en forme par CSS avec pour chaque ligne un label, un champ et une info-bulle à droite. Cette info-bulle est par défaut masquée et ne s'affiche que si le focus est dans le champ de cette ligne ou si on clique sur la ligne (<p>) La ligne est positionnée en "relative", l'info-bulle en revanche est en "absolute" puisqu'elle est positionnée pour cette ligne-ci.
À un endroit de mon formulaire, j'ai une phrase explicative dans une ligne, phrase qui occupe une largeur suffisante pour terminer là où se trouve une partie de l'infobulle de la ligne précédente. Avec un z-index approprié, cette info-bulle s'affiche bien par dessus la phrase en question, comme on peut voir dans mon graphique ci-dessus... sous Firefox. Mais sous IE, la bulle se glisse en dessous de la phrase comme ceci :
Exemple IE
+--------------------------+ +-----------------------+
Un label |un champ de formulaire | |< Une info-bulle |
+--------------------------+ +-+ avec du texte et |
+--------------------------+ | des explications |
autre label | autre champ | | aussi diverses |
+--------------------------+ | que variées comme |
| aide à l'internaute |
Ici une phrase explicative quelconque d'information supplémentaire ou aide
J'ai tenté d'indiquer explicitement un z-index inférieur à ladite phrase, mais il n'y a rien à faire et le texte reste par dessus mon info-bulle.
Qu'est-ce que j'ai loupé ??
Sous Firefox, aucun problème, tout fonctionne très bien
Modifié par Cyrano (13 Jun 2008 - 15:29)