28172 sujets

CSS et mise en forme, CSS3

[Résolu] Probleme affichage calendrier PHP sur Internet Explorer

Bonjour J'ai créé un calendrier PHP dont voici le code,
Il est bien affiché sous Chrome, mais c'est la catastrophe sur Internet Explorer

Merci de m'aider

Un exemple est visible ici http://www.guadadvent.org/calendrier_essaie.php


<style type="text/css">   
 
   .today{
          font-weight:bold;
          color:red;
      }
       
      .mois {
      background:#FFF;
      height:30px;
      line-height:30px;
      width:100%;
      text-align:center;
      margin-right:-100px;"
      }
       
      .jours {
    background:#FFF; 
    border:1px #999933 solid;
    padding:5px;
    height:30px;
    line-height:30px;
    width:100px;
    float:left;
    text-align:center;
    margin-right:-3px;
    margin-bottom:1px;"
      }
      .cellule {
           background:#FFF;
           border:1px #999933 solid;
           padding:5px;
           height:70px;
           width:100px;
           float:left;
           text-align:right;
           margin-right:-3px;
           margin-bottom:1px;
      }
       
      .cellule_vide {
    padding:5px;
    height:70px;
    width:100px;
    float:left;
    text-align:right;
    margin-right:-1px;
    margin-bottom:1px;"
      }
 
      .cellule:hover {
                background:#CCC;
                border:1px solid red;
      }
      .separateur {
         style="clear:both;" 
      }
       
      .cadre {
          display:inline-block;
          background:#CCC;
          position:relative;
      }
      .nav_gauche {
          position:absolute;
          top:0px;
          left:0px;
          text-decoration:none;
          padding-left:50px;
           
      }
       
      .nav_droite {
           position:absolute;
           top:0px;
           right:0px;
           text-decoration:none;
           padding-right:50px;
      }
       
      </style>
      
 
 
<?php
$tabmois = array ("","Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre");
$tabjours = array ("","Dimanche","Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi");?>
 
<?php $an=$_REQUEST["a"];
if(empty($an)) $an=date("Y");
$mois=$_REQUEST["m"];
$jour_serveur=date("j");
$mois_serveur=date("m");
if(empty($mois)) $mois=$mois_serveur;
if($mois==12) $mois_suivant=1; else $mois_suivant=$mois+1;
if($mois==1) $mois_precedent=12; else $mois_precedent=$mois-1;?>
 
 
<?php    
$premJourdumois = date("w" , mktime(0,0,0,$mois,1,$an) )+1;// en chiffre, +1 si calendrier comence par dimanche, soit 1 pour dimanche
$nbJoursdanslemois = date("t" , mktime(0,0,0,$mois,1,$an)); // respecte les années bixectiles
$nbdecellulesvidesavantdebut = $premJourdumois-1; // nom de variable explicite
?>
 
 
<div class="cadre">
 
<div class="mois">
  <div class="nav_gauche" > <a href="?m=<?php echo $mois_precedent;?>">&lt;&lt;</a> </div>
  <?php echo $tabmois[$mois];?>
  <div class="nav_droite"> <a href="?m=<?php echo $mois_suivant;?>">&gt;&gt;</a> </div>
  </div>
 
        <div class="separateur"></div>
 
<?php // les jours
for ($i=1;$i<=7;$i++) {?>
<div class="jours"><?php echo $tabjours[$i];?> </div>
<?php } ?>
 
<div class="separateur"></div>
 
<?php // cellules vide avant le debut de l'affichage
 for ($i=1;$i<=$nbdecellulesvidesavantdebut;$i++) {?>
  <div class="cellule_vide"></div>
    <?php }?>
     
<?php // affichage du calendrier
for ($i=1;$i<=$nbJoursdanslemois;$i++) {?>
<?php if(($i==$jour_serveur) and ($mois==$mois_serveur)) $auj="today"; else $auj=""; // si c'est le jour d'aujourd'ui on met une classe spéciale?>
  <div class="<?php echo $auj;?> cellule"><?php echo $i;?></div>
    
   <?php // saut si on liste une semaine soit 7 jours
   if(($i+$nbdecellulesvidesavantdebut)%7 == 0 ) {?>
        <div class="separateur"></div>
         
    <?php }?>
     
    <?php }?>
 
</div>



Merci
bonjour

C'est quoi le problème sous IE? est ce que t'as une capture d'écran qu'on puisse trouver ce qui ne va pas

Déjà petite piste apparemment tu as des guillemets en trop dans ton CSS apres ton margin-right de ta classe .today et à la fin de ta .jours ainsi qu'a la fin de .cellules_vides
Merci
J'ai viré les " en trop, et le style en trop
ça donne ça


<style type="text/css">    

   .today{
          font-weight:bold;
		  color:red;
      }
	  
	  .mois { 
	  background:#FFF;
	  height:30px;
	  line-height:30px;
	  width:100%;
	  text-align:center; 
	  margin-right:-100px;
	  }
	  
	  .jours {
	background:#FFF;  
	border:1px #999933 solid; 
	padding:5px; 
	height:30px;
	line-height:30px;
	width:100px; 
	float:left;
	text-align:center; 
	margin-right:-3px; 
	margin-bottom:1px;
	  }
      .cellule { 
		   background:#FFF; 
		   border:1px #999933 solid; 
		   padding:5px; 
		   height:70px; 
		   width:100px; 
		   float:left;
		   text-align:right; 
		   margin-right:-3px; 
		   margin-bottom:1px;
      }
	  
	  .cellule_vide {
	padding:5px; 
	height:70px; 
	width:100px; 
	float:left;
	text-align:right; 
	margin-right:-1px; 
	margin-bottom:1px;
	  }

	  .cellule:hover { 
	            background:#CCC;
				border:1px solid red;
	  }
	  .separateur {
		clear:both;
	  }
	  
	  .cadre {
		  display:inline-block;
		  background:#CCC;
		  position:relative;
	  }
	  .nav_gauche {
		  position:absolute; 
		  top:0px; 
		  left:0px;
		  text-decoration:none;
		  padding-left:50px;
		  
	  }
	  
	  .nav_droite {
		   position:absolute; 
		   top:0px; 
		   right:0px;
		   text-decoration:none;
		   padding-right:50px;
	  }
	  
      </style>


Je n'ai plus les grossières erreurs, mais il y a encore un décalage, alors ça donne ça

I explorer 8

http://www.guadadvent.org/sur%20ie.jpg


Chrome

http://www.guadadvent.org/sur%20chrome.jpg
C'est bon
Il fallait juste rajouter


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


Merci pour votre aide

Un conseil? ou c'est bon ainsi?
bon super Smiley biggrin !

A part ça non, je pense que c'est correct... je mettrai plus de couleur mais ça c'est vraiment du détail Smiley cligne
Sujet clos
Aller à