Discussion :

[valérieH]

Bonjour à tous,
Je dévelloppe un site en css avec visual studio (contrôle asp.net) et Ajax, tout est dynamique et donc assez dur à gérer lors de bug.

J'ai un probleme de z-index sur une de mes pages:

Je m'explique:

il s'agit d'un questionnaire avec des aide, lorsque l'on clique sur le ? situé à côté de chaques champs, une petite boite (css) s'ouvre et affiche les infos. les textes sont tirés d'une db.

Mon soucis est le le dernier et le plus long texte s'affiche au dessus de mon footer.

le footer de la page se trouve sur une page différente (la masterpage), est en position absolute et à un z-index de 4.

mon texte d'aide à une position absolute avec un z-index supérieur à celui du footer.

En Firefox il n'y a pas de problème mais les deux IE, c'est vraiment catastrophique:

mon code du footer:
--------------------

.footerCENTER {
BACKGROUND-IMAGE: url(images/images/bkgrdFOOTER.gif);
WIDTH: 99%;
left: 4px; right: 4px;
background-repeat: repeat;
margin-BOTTOM: 0;
LINE-HEIGHT: 1.5em;
hEIGHT: 38px;
position: absolute; z-index: 4;
BACKGROUND-COLOR: #9d9699;

}

le css pour le style d'affichage de la boite:
-----------------------------------------
.txtqhelp{ position: absolute;
z-index: 155;
Top: 0px;
left: 10px;
border: 1px solid #cecece;
background-color: #eeeeee;
color: #6f022A;
white-space: normal;
text-align: left;
padding: 1px;}



et la portion de code (fichier acsx)
---------------------------------
<td style="width: 30px;">

<asp:Label ID="Help" runat="server" CssClass="qhelp">?</asp:Label>


<ajaxToolkit:PopupControlExtender ID="PopupControlExtender1" runat="server" PopupControlID="PnlHelp"
TargetControlID="Help" Position="top" OffsetY="50" OffsetX="-35">
</ajaxToolkit:PopupControlExtender>



<asp:Panel ID="PnlHelp" runat="server" CssClass="txtqhelp" ScrollBars="Horizontal">

<asp:Literal ID="LiteralQuestionHelp" runat="server" ></asp:Literal>
</asp:Panel>
</td>


Même en IE6 il ne tiens pas compte du Offset.
Si quelqu'un peut m'aider car là franchement je suis à bout! depuis 8h00 ce matin j'en aie ras la patate...

PS: en retirant le position: absolute sur le footer cela marche mais je n'aie pas envie de fiche en l'air mon footer car il à été dévelloppé 100% comptaible all vs browser donc s'il y aurait un autre moyen...


Merci en tout cas d'avance à tout ceux qui voudrons bien m'aider.


vali

[razorlok]

.footerCENTER
{
clear:both;
BACKGROUND-IMAGE: url(images/images/bkgrdFOOTER.gif);
WIDTH: 99%;
left: 4px; right: 4px;
background-repeat: repeat;
margin-BOTTOM: 0;
LINE-HEIGHT: 1.5em;
hEIGHT: 38px;
position: absolute; z-index: 4;
BACKGROUND-COLOR: #9d9699;
}

Je ne sais pas trop, mais tu peux essayer.