Problème avec le widget Calendrier YUI

Question

J'ai réussi à faire fonctionner correctement le widget du calendrier YUI. Mais quand il l'affiche, il ne "flotte" pas sur la page, c'est-à-dire qu'il pousse le contenu autour de la forme. J'en ai besoin pour flotter au-dessus de la page et ne pas affecter d'autres éléments.

Il ne semble pas qu'une propriété force le calendrier à flotter sur la page.

Est-ce que quelqu'un sait comment s'assurer que le widget flotte au-dessus de la page lorsqu'il est affiché. Le bouton qui affiche le widget est à l'intérieur d'une table. HTML ci-dessous

<tr> 
<td>Expiry Date</td> 
<td><input name="ExpiryDate" value="" id="ExpiryDate"> 
     <img id="calico" src="resources/images/calendar_icon.gif" /> 
      <div id="calWidget"></div> 
</td> 
</tr> 

Answer 1

réussi à trouver une solution. Quand tout le reste échoue .. il suffit d'ajouter plus de HTML et de style.

Enveloppez d'abord le "calWidget" avec un autre div (nous donnerons un identifiant de "calPanel"). Il ressemblera à ceci.

<tr> 
<td>Expiry Date</td> 
<td><input name="ExpiryDate" value="" id="ExpiryDate"> 
     <img id="calico" src="resources/images/calendar_icon.gif" /> 
      <div id="calPanel"> 
      <div id="calWidget"></div> 
      </div> 
</td> 
</tr> 

Puis, avec un peu de CSS simple, la calPanel enveloppements "relative" autour du CalWidget positionné "absolu". Vous pouvez batifoler avec le positionnement du calendrier à partir de là en utilisant gauche/droite/haut/bas dans le CSS « ​​#calWidget » ..

#calPanel { 
    position:relative; 
} 

#calWidget { 
    display:block; 
    position:absolute; 
    left:0px; 
    z-index:99; 
} 

positionnement semble être cohérent dans IE7/8 et FF3 + ... J'espère que cela vous aidera si vous avez le même problème ...