Bonjour, voila j'ai un problème, comme le titre l'indique, avec une div.
En fait j'essaie de créer un calendrier de type google Agenda grâce à ajax.
En gros voila ce que ça donne sous IE: (ce que je veux obtenir sous firefox)
et voila ce que ça donne sous Firefox:
ce calendrier est créé dynamiquement via une fonction javascript/ajax que voici:
et le tout est inséré dans la div ci-dessous:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39 function initGrandCalendrier(){ var compteur_lignes=0; var compteur = 1; var numJourCourant = 1; var total=1; var now = new Date(); var mois = now.getMonth(); var année = now.getUTCFullYear(); var numJour = recupPremierJour(mois,année); var fr_mois=recupMois(mois); var codeHTML = '<table class="tableBouton" cellspacing="0" cellpadding="0" style="border-collapse : collapse;" width="100%" height="100%"><tr id="menuHaut"><td align="center"><a href="javascript:rafraichirCalendrier(\'precedent\')" onMouseOver="bouton.src=\'Image/precedent1.jpg\';" onMouseOut="bouton.src=\'Image/precedent.jpg\';"><img src="Image/precedent.jpg" border="0" name="bouton"><a href="" onMouseOver="bouton1.src=\'Image/jour1.jpg\';" onMouseOut="bouton1.src=\'Image/jour.jpg\';"><img src="Image/jour.jpg" border="0" name="bouton1"><a href="" onMouseOver="bouton2.src=\'Image/semaine1.jpg\';" onMouseOut="bouton2.src=\'Image/semaine.jpg\';"><img src="Image/semaine.jpg" border="0" name="bouton2"><a href="" onMouseOver="bouton3.src=\'Image/mois1.jpg\';" onMouseOut="bouton3.src=\'Image/mois.jpg\';"><img src="Image/mois.jpg" border="0" name="bouton3"><a href="javascript:rafraichirCalendrier(\'suivant\')" onMouseOver="bouton4.src=\'Image/suivant1.jpg\';" onMouseOut="bouton4.src=\'Image/suivant.jpg\';"><img src="Image/suivant.jpg" border="0" name="bouton4"></td></tr><tr id="grilleAgenda" height="95%"><td><table class="st-grille" cellspacing="0" cellpadding="0" width ="100%" height ="100%"><tr><td class="st-dJour" align="center">Lundi</td><td class="st-dJour" align="center">Mardi</td><td class="st-dJour" align="center">Mercredi</td><td class="st-dJour" align="center">Jeudi</td><td class="st-dJour" align="center">Vendredi</td><td class="st-dJour" align="center">Samedi</td><td class="st-dJour" align="center">Dimanche</td></tr>'; while(compteur_lignes<6){ codeHTML += '<tr>'; var compteur_colonnes=0; while(compteur_colonnes<7 && compteur<43){ if (compteur<numJour){ codeHTML += '<td class="st-dtitreNonMois"><table class="sousGrille" cellspacing="0" cellpadding="0" border="1"><tr height="20%"><td class="titreNonMois" align="right"><span>'; codeHTML+=" "; } else if(CheckDate(mois,numJourCourant,année)==true){ codeHTML += '<td class="st-dtitre"><table class="sousGrille" cellspacing="0" cellpadding="0" border="1"><tr height="20%"><td class="titre" align="right"><span>'; codeHTML+=numJourCourant; numJourCourant++; } else{ codeHTML += '<td class="st-dtitreNonMois"><table class="sousGrille" cellspacing="0" cellpadding="0" border="1"><tr height="20%"><td class="titreNonMois" align="right"><span>'; codeHTML+=" "; } compteur++; codeHTML += '</span></td></tr><tr height="80%"></tr></table></td>'; compteur_colonnes++; total++; } codeHTML += '</tr>'; compteur_lignes++; } codeHTML += '</table></td></tr></table>'; document.getElementById("grandCalendrier").innerHTML=codeHTML; }
si je construit le tableau non dynamiquement (en dur directement dans ma page HTML sans la div) le calendrier s'affiche correctement. Il semblerait que ce soit la DIV qui compresse mon tableau.
Code : Sélectionner tout - Visualiser dans une fenêtre à part <div id="grandCalendrier" class="conteneur calendrier"></div>
question 1: Suis-je dans la bonne section?
question 2: Si oui, que puis-je faire en CSS pour remédier à ce problème?
Merci
Partager