Partage
  • Partager sur Facebook
  • Partager sur Twitter

Compatibilité IE

Rendre mon site compatible IE

Drazzyt
    8 janvier 2006 à 15:00:10

    Salut,
    j'aimerais que quelqu'un m'aide pour rendre mo ndesign compatible IE.
    Ca serais bien que vous me disiez quels propréter modifier et comment.
    Merci d'avance.
    Mon code html :
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Document sans nom</title>
    <link href="styles.css" media="screen" rel="stylesheet" type="text/css" />
    <link href="template/default/styles.css" media="screen" rel="stylesheet" type="text/css" />
    </head>

    <body>

    <div id="corps">
    <div id="header"></div>
    <div id="speed_barre">
      <a id="speed_barre" href="index.php">Accueil</a>
      <a id="speed_barre" href="scripts.php">Scripts PHP</a>
      <a id="speed_barre" href="kits.php">Kits Graphiques</a>
      <a id="speed_barre" href="newsletters.php">NewsLetters</a>
      <a id="speed_barre" href="commande.php">Commande</a>
      <a id="speed_barre" href="survotresite.php">Sur votre site</a>
      <a id="speed_barre" href="contact.php">Contact</a>
    </div>
    <div id="f7">
      <div id="f2">
      <div id="top_f2"></div>
      <div id="texte_f2">
          <div id="f3_2">
          <div id="titre_f3_2">Liste des cat&eacute;gories </div>
              <div id="texte_f3">
              <ul>
            <!-- BEGIN cat_scripts -->
            <li><a href="scripts.php?p=categorie&amp;categorie={cat_scripts.ID_CAT_SCRIPTS}">{cat_scripts.NOM_CAT_SCRIPTS}</a></li>
            <!-- END cat_scripts -->
          </ul>
          &gt;&gt; <a href="#">Tous les scripts en diaporama</a>.
              </div>
          <div id="bottom_f3_2"></div>
          </div>
              
              <div id="f3">
          <div id="titre_f3">Des scripts PHP </div>
              <div id="texte_f3">
              Divers scripts vous sont mis &agrave; dispositions, tous &agrave; <u>prix tr&egrave;s bas (3 allopass)</u>.<br />
              Il sont chaque fois cod&eacute; de deux mani&egrave;res : Normale et PHPlib. La mani&egrave;re PHPLib permet une facilit&eacute; pour skinner le script. Nos scripts sont cod&eacute;s en xHtml/CSS et aux normes W3C. Dans le cas contraire il est signaler dans la description. Bonne visite ... <br />
              <br />
              </div>
              <div id="bottom_f3"></div>
          </div>
      </div>
      <div id="bottom_f2"></div>
      </div>
     
      <div id="f2">
      <div id="titre_f2">4 Kits graphiques au hasard :</div>
      <div id="top_f2"></div>
      <div id="texte_f2">
        <div id="f8">
          <!-- BEGIN hasard_kits -->
          <div id="f6"> <a href="kits.php?p=kit&categorie={hasard_kits.CATEGORIE_KIT}&id={hasard_kits.ID_KIT}"><img src="{hasard_kits.BOUTON_KIT}" alt="{hasard_kits.NOM_KIT}" /></a>
              <div id="bottom_f6">{hasard_kits.NOM_KIT}</div>
              </div>
              <!-- END hasard_kits -->
              <div id="bout_f6">
              </div>
            </div>
      </div>
      <div id="bottom_f2"></div>
      </div>
     
      <div id="f2">
      <div id="titre_f2">4 Scripts PHP au hasard :</div>
      <div id="top_f2"></div>
      <div id="texte_f2">
        <div id="f8">
              <!-- BEGIN hasard_scripts -->
          <div id="f6"> <a href="scripts.php?p=kit&categorie={hasard_scripts.CATEGORIE_SCRIPT}&id={hasard_scripts.ID_SCRIPT}"><img src="{hasard_scripts.BOUTON_SCRIPT}" alt="{hasard_scripts.NOM_SCRIPT}" /></a>
              <div id="bottom_f6">{hasard_scripts.NOM_SCRIPT}</div>
              </div>
              <!-- END hasard_scripts -->
              <div id="bout_f6">
              </div>
            </div>
      </div>
      <div id="bottom_f2"></div>
      </div>
     
      <div id="f1">
      <div id="top_f1"></div>
      <div id="texte_f1">
      <span class="petit_titre">Bienvenue sur Drazzyt !</span><br /><br />
      Drazzyt est un site qui permet d'<u>aider</u> les &quot;nuls&quot; en graphisme<br />
      et en programmation en leurs <u>proposant de t&eacute;l&eacute;charger des kits graphiques ou scripts PHP </u> &quot;tout fait&quot;.<br />
      Nous leurs offrons &eacute;galement la <u>possibilit&eacute; de commander</u> divers &eacute;l&eacute;ments personalis&eacute;s ....<br />
      Mais ce n'est pas tout ! Si vous avez un Siteweb et que vous voulez augmenter vos revenus, Drazzyt vous propose une affiliation. Plus d'infos dans la partie concern&eacute;e.
      </div>
      <div id="bottom_f1"></div>
      </div>
      <br />
      <div id="f5">
      <div id="top_f5"></div>
      <div id="texte_f5">
      <span class="petit_titre">Quelques chiffres ...</span><br /><br />
      - {NBR_KITS} kits graphiques.<br />
      - {NBR_SCRIPTS} scripts PHP.
      <br />
      <br />
      <span class="petit_titre">Quelques Dates ...</span><br /><br />
      - Site ouvert le **/**/**.
      <br />
      <br />
      <span class="petit_titre">Notre bouton :</span><br /><br />
      <img src="template/default/images/88x31.png" alt="" />
      </div>
      <div id="bottom_f5"></div>
      </div>

    </div>
    <div id="copyright">&copy; Drazzyt 2006 | Tous droits réservés, reproduction interdite | Site réalisé par Drazzyt<br />Liens utiles : <a href="regles.php">Règles</a> - <a href="contact.php">Contact</a> - <a href="recrutement.php">Recrutement</a> - <a href="Affiliation.php">Affiliation</a></div>
    </div>

    </body>
    </html>

    Et le css :
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*--Eléments importants----------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    html{ overflow-x: hidden; }
    img { border: 0px; }
    #corps
    {
    margin-top: -10px;
    margin-left: -10px;
    margin-right: -10px;
    }
    #header
    {
    width: 100%;
    height: 98px;
    background-color: #ABBBC9;
    background-image: url(images/logo.png);
    background-repeat: repeat-y;
    }
    #speed_barre
    {
    width: 100%;
    height: 23px;
    padding-top: 10px;
    padding-bottom: 5px;
    background-image: url(images/menu.png);
    background-repeat: repeat-x;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    text-align: center;
    }
    #copyright
    {
    width: 100%;
    border-top: 1px solid #F7D599;
    text-align: center;
    clear: both;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    padding-top: 5px;
    }
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*--Les liens--------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    a#speed_barre
    {
    margin-top: -10px;
    margin-bottom: -5px;
    background-image: url(images/menu.png);
    background-repeat: repeat-x;
    height: 33px;
    padding-left: 20px;
    padding-right: 20px;
    color: white;
    text-decoration: none;
    }
    a#speed_barre:hover
    {
    background-image: url(images/rollover_menu.png);
    background-repeat: repeat-x;
    color: white;
    text-decoration: none;
    }
    a:hover
    {
    color: #E8ECEF;
    text-decoration: none;
    }
    a
    {
    color: #2D557A;
    text-decoration: none;
    }
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*--Les fenêtres-----------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    #f7
    {
    width: 100%;
    padding: 10px;
    }
    #f1
    {
    width: 199px;
    background-image: url(images/bg_f1.png);
    background-repeat: repeat-y;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    margin-left: 40px;
    }
    #texte_f1
    {
    margin-left : 7px;
    margin-right: 7px;
    }
    #top_f1
    {
    width: 199px;
    height: 11px;
    background-image: url(images/top_f1.png);
    background-repeat: no-repeat;
    }
    #bottom_f1
    {
    width: 199px;
    height: 12px;
    background-image: url(images/bottom_f1.png);
    background-repeat: no-repeat;
    }
    #f5
    {
    width: 199px;
    background-image: url(images/bg_f5.png);
    background-repeat: repeat-y;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    margin-left: 40px;
    }
    #texte_f5
    {
    margin-left : 10px;
    margin-right: 10px;
    }
    #top_f5
    {
    width: 199px;
    height: 11px;
    background-image: url(images/top_f5.png);
    background-repeat: no-repeat;
    }
    #bottom_f5
    {
    width: 199px;
    height: 10px;
    background-image: url(images/bottom_f5.png);
    background-repeat: no-repeat;
    }
    #f2
    {
    width: 624px;
    background-image: url(images/bg_f2.png);
    background-repeat: repeat-y;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    float: right;
    margin-right: 40px;
    margin-bottom: 40px;
    }
    #f2_2
    {
    width: 604px;
    background-image: url(images/bg_f2.png);
    background-repeat: repeat-y;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    margin-bottom: 20px;
    }
    #texte_f2
    {
    margin-left : 10px;
    margin-right: 10px;
    }
    #top_f2
    {
    width: 624px;
    height: 11px;
    background-image: url(images/top_f2.png);
    background-repeat: no-repeat;
    }
    #titre_f2
    {
    width: 350px;
    height: 19px;
    margin-top: -30px;
    padding-top: 7px;
    padding-left: 50px;
    background-image: url(images/titre_f2.png);
    background-repeat: no-repeat;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    }
    #bottom_f2
    {
    width: 624px;
    height: 10px;
    background-image: url(images/bottom_f2.png);
    background-repeat: no-repeat;
    clear: right;
    }
    #f3
    {
    width: 290px;
    background-image: url(images/bg_f3.png);
    background-repeat: repeat-y;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    margin-bottom: 10px;
    }
    #texte_f3
    {
    margin-left : 10px;
    margin-right: 10px;
    }
    #titre_f3
    {
    width: 290px;
    height: 21px;
    background-image: url(images/titre_f3.png);
    background-repeat: no-repeat;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    padding-top: 4px;
    margin-bottom: 5px;
    }
    #bottom_f3
    {
    width: 290px;
    height: 10px;
    background-image: url(images/bottom_f3.png);
    background-repeat: no-repeat;
    }
    #f4
    {
    width: 596px;
    background-image: url(images/bg_f4.png);
    background-repeat: repeat-y;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    clear: right;
    }
    #texte_f4
    {
    margin-left : 10px;
    margin-right: 10px;
    }
    #titre_f4
    {
    width: 596px;
    height: 21px;
    background-image: url(images/titre_f4.png);
    background-repeat: no-repeat;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    padding-top: 4px;
    margin-bottom: 5px;
    }
    #bottom_f4
    {
    width: 596px;
    height: 10px;
    background-image: url(images/bottom_f4.png);
    background-repeat: no-repeat;
    }
    #f3_2
    {
    width: 290px;
    background-image: url(images/bg_f3.png);
    background-repeat: repeat-y;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    float: right;
    margin-right: 5px;
    margin-left: 15px;
    margin-bottom: 5px;
    }
    #titre_f3_2
    {
    width: 290px;
    height: 21px;
    background-image: url(images/titre_f3.png);
    background-repeat: no-repeat;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    padding-top: 4px;
    margin-bottom: 5px;
    }
    #bottom_f3_2
    {
    width: 290px;
    height: 10px;
    background-image: url(images/bottom_f3.png);
    background-repeat: no-repeat;
    }
    #f6
    {
    float: left;
    width: 120px;
    height: 119px;
    background-image: url(images/f6.png);
    background-repeat: norepeat;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    margin-right: 5px;
    text-align: center;
    }
    #bottom_f6
    {
    width: 120px;
    height: 19px;
    background-image: url(images/bottom_f6.png);
    background-repeat: no-repeat;
    text-align: center;
    padding-top: 3px;
    margin-top: -2px;
    }
    #bout_f6
    {
    width: 36px;
    height: 119px;
    background-image: url(images/bout_f6.png);
    background-repeat: no-repeat;
    float: left;
    margin-left: 50px;
    }
    #f8
    {
    height: 116px;
    }
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*--Les ecritures----------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------------------------------------------------------------------------------------*/
    .petit_titre
    {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    }
    input
    {
    margin-top: 1px;
    background-color: #FFFFFF;
    border: 1px solid #2C5479;
    height: 15px;
    color: #000000;
    font-weight: bold;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    text-align: center;
    }
    .rien
    {
    background-color: #A4BAD1;
    border: 1px solid #A4BAD1;
    vertical-align: middle;
    }


    Merci d'avance,
    drazzyt
    • Partager sur Facebook
    • Partager sur Twitter
    scorpio
      8 janvier 2006 à 18:59:45

      désolé, je connais rien en kit ^^ pas de chance pour toi.
      • Partager sur Facebook
      • Partager sur Twitter
      Mackoz
        12 janvier 2006 à 10:55:55

        OK simple tu change toute tes image PNG en GIF ou JPG.
        Car IE a un gros probleme avec les PNG 24Bit.
        Le mieux c'est que tu cherche un script "Javascript" ( google )
        Qui te permet de faire un switch de feuille de style avec une fenetre d'alert qui previen que le site est code pour firefox et Safari ect.. GOod Luck
        • Partager sur Facebook
        • Partager sur Twitter
        YoOp
          14 janvier 2006 à 12:26:19

          Moué normalement si on code bien, il n'y pas de problèmes de compatibilité sauf si on utilises des hack!

          Tu n'aurais pas un exemple en ligne et dire qu'est ce qui ne vas pas sous IE ?
          • Partager sur Facebook
          • Partager sur Twitter
          neoxx78
          • HTML / CSS
            14 janvier 2006 à 12:32:04

            Tu as un tuto de switch de css sur le SdZ :

            Switch CSS par Mamelook

            • Partager sur Facebook
            • Partager sur Twitter
            Rikudo.fr Jeu de Rikudo gratuit et en ligne - Rikudo-puzzle.com (EN) - Rikudo.pl (PL) Tutoriel : La sémantique HTML / Un menu horizontal

            Compatibilité IE

            × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
            × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
            • Editeur ●
            • Markdown