Partage
  • Partager sur Facebook
  • Partager sur Twitter

IE m'énerve ...

design qui marche sous mozilla mais foire sous ie !

JefGrailet
    22 avril 2006 à 8:57:18

    Bonjour à tous , je poste ce topic pour vous demander de l'aide pour un design , en effet , j'ai fait une petite modification , et le design marche parfaitement sous firefox mais bien évidamment IE veut foutre sa m*rde et dessus le menu disparaît eti l y a un trou énorme dans le corps !

    Voilà la page en question : cliquez ici

    Regardez sous firefox et IE ... vous me comprendrez un peu mieux ...

    Voilà le codage complet :

    <!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>.:Gameworld : Nomadeland:.</title>
    <style type="text/css">
    <!--
    body {width:850px; height:auto; margin:0 auto; padding:0;background:#202020; }
    #L {
            background:#2f2f2f  url(new_design/nomadeland_L.png) repeat-y left top;
            margin: 0px;
            padding: 0px;
            height: auto;
            width: auto;
    }
    #R {
            background: url(new_design/nomadeland_R.png) repeat-y right top;
            margin: 0px;
            padding: 0px;
            height: auto;
            width: auto;
    }
    #banniere {
            margin: 0px 34px 0px 29px;
            padding: 0px;
            height: 164px;
            width: auto;
            background: #2f2f2f  url(new_design/nomadeland_header.png) no-repeat center center;
    }
    #m_horiz {
            margin: 0 35px 0 30px;
            padding: 0px;
            height: 38px;
            width: auto;
            #2f2f2f
    }
    #horzi_L {
            background: url(new_design/nomadeland_m_horiz_L.png) no-repeat left center;
            margin: 0px -3px 0px 0px;
            padding: 0px;
            height: 33px;
            width: 51px;
            float:left;
    }
    #horiz_R {
            background: url(new_design/nomadeland_m_horiz_R.png) no-repeat right center;
            margin: 0px 0px 0px -3px;
            padding: 0px;
            float: right;
            width: 50px;
            height:33px;
    }

    #horiz_C{
            background: #2f2f2f  url(new_design/nomadeland_m_horiz_C.png) repeat-x right center;
            margin: 0;
            padding: 0px;
            height: 33px;
            width: auto;
            text-align:center;
    }
    #m_horiz a {color:#fff; text-decoration:none;font-weight:500;
     padding:0 0.5em 0 0.5em;  margin: 6px 0 0 0; display:block;
    font-size:0.9em; font-family:Arial, Helvetica, sans-serif; }
    #m_horiz ul { margin:0 10%; padding:0 ; list-style:none; }
    #m_horiz li { float:left; display:block; }
    #menu {
            display: inline;
            margin: 0 0px 0px 20px;
            padding: 0px;
            float: left;
            height: auto;
            width: 150px;
    }
    #menu h3 {
            background: url(new_design/h_menu.png) no-repeat;
            margin: 0px auto;
            padding: 5px 0 0 0px;
            height: 23px;
            width: 136px;
            font-size:16px;
            color:#FFFFFF;
            text-align:center;
    }
    #menu a { text-decoration:none; color:#fff; display:block; margin:0;
    font-weight:500; font-size:15px; font-family:Arial, Helvetica, sans-serif; }
    #menu ul { margin: 0 6px 0 2px; padding:2px 0 4px 0; list-style:none; background: #224563; }
    #menu li {margin:3px 0 0 16px; padding:0; }     
    .sous_menu {
            margin: auto  auto 20px auto;
            padding: 0px;
            height: auto;
            width: 140px;
    }
    #corps {
        background: #2f2f2f;
            margin: 0px 35px 0px 30px;
            padding: 0px;
            height: auto;
            width: auto;
            }
    #contenu {
            margin: -5px 16px 0px 170px;
            padding: 0 0 15px 0;
            height: auto;
            width: auto;
              background: #2f2f2f url(new_design/corps.png) repeat-y;
    }

    #bas{
    margin: -5px 16px 0px 170px;
    }

    #contenu p { color:#fff; margin: 0px 15px;  text-align:justify; font-family: arial,sans-serif,verdana;  font-size : 13px;}
    #contenu h1  { margin: 0px 15px; font-family: arial , sans-serif , verdana; }
    #contenu h2  { margin: 0px 15px; font-family: arial , sans-serif , verdana; }
    #contenu h3 { margin: 0px 15px; font-family: arial , sans-serif , verdana; }
    #contenu h4  { margin: 0px 15px; font-family: arial , sans-serif , verdana; }
    #contenu h5  { margin: 0px 15px; font-family: arial , sans-serif , verdana; }
    #contenu h6  { margin: 0px 15px; font-family: arial , sans-serif , verdana; }
    #contenu textarea  { margin: 0px 15px; }
    #contenu table  { margin: 0px 15px; }
    #contenu input  { margin: 0px 15px; }

    #contenu a
    {
    text-decoration: none;
    color: rgb(23,139,255);
    }

    #contenu a:hover
    {
    text-decoration: none;
    color: white;
    }

    #contenu a:active
    {
    text-decoration: none;
    color: rgb(0,120,240);
    }

    #contenu a:focus
    {
    text-decoration: none;
    color: rgb(0,120,240);
    }

    #contenu a:visited
    {
    text-decoration: none;
    color: rgb(0,120,240);
    }


    #footer { width:100%; text-align:center; background: #2f2f2f;
    font-size:12px; color:#fff; clear:both;}
    .tableau
    {
     border: 2px outset rgb(214,240,255);
     border-collapse: collapse;
    }

    .th
    {
     border: 2px outset rgb(214,240,255);
     background-color: rgb(214,240,255);
     color: black;
      FONT-SIZE: 13px;
    }


    .td
    {
     border: 2px outset rgb(214,240,255);
     background-color: white;
     color: black;
     margin: 12px 15px;
    text-align:justify;
    font-family: arial,sans-serif,verdana; 
    font-size : 13px;
    }

    -->
    </style>
    </head>

    <body>
    <div id="L">
      <div id="R">
        <div id="banniere"></div>
        <div id="m_horiz">
          <div id="horzi_L"></div><div id="horiz_R"></div>
          <div id="horiz_C"><ul><li><a href="http://nomadeland.jexiste.fr/index.php">Gameworld</a></li>  <li><a href="http://nomadeland.jexiste.fr/nomadeland/index2.php">Sedentaryland</a></li> <li><a href="http://nomadeland.jexiste.fr/nomadeland/em.php">Espace membre</a></li></ul></div></div> <div id="corps">
            <div id="menu">
                              <div class="sous_menu"><h3>Rechercher</h3>
    <ul><form action="rechercher.php" method="post">
       &nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="search" size="12"/><br/><br/>
      &nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" value="Rechercher" name="envoyer"/>
       </form></ul></div>
              <div class="sous_menu"><h3>Jeux vidéos</h3>
    <ul><li><a href="tp.php">- Tests et <br/> &nbsp;  previews</a></li><li><a href="dossiers.php">- Dossiers</a></li><li><a href="as.php">- Astuces et <br/> &nbsp; soluces</a></li><li><a href="tp_rapidos.php">- Rapidos</a></li><li><a href="pre-test.php">- Pré-tests</a></li><li><a href="liste_bilans.php">- Bilans</a></li>
    <li><a href="video1.php">- Vidéos</a></li><li><a href="tp_fiches.php">- Fiches</a></li><li><a href="index.php">- News</a></li></ul></div></div>
                    <img src="new_design/haut.png" alt="haut"/>
                    <div id="contenu">

    <p>Test.</p>

    </div>
    <div id="bas">
                    <img src="new_design/bas.png" alt="bas"/>
                    </div>     
               <div id="footer"><img src="new_design/footer.png" alt="graphisme" /><br/><br/>
               <!--Script flesko-->
    <style type="text/css">
    .flesko{margin:auto;text-align:center;font:normal 10px arial;border:1px solid #3C4BBF;background:#62C2EF;width:88px;padding:2px;color:#2E1072;line-height:10px;filter:progid:DXImageTransform.Microsoft.Gradient
    (GradientType=0,StartColorStr='#ffffffff',EndColorStr='#62C2EF');}
    a.iflesko {color:#3C4BBF;font:normal 11px arial;text-decoration:none;line-height:10px;}
    a:hover.iflesko {color:#DE2581}
    </style>
    <div class="flesko">
    Selectionné<br><a class="iflesko" href="http://www.flesko.com" title="Annuaire thématique flesko.com"  onclick="window.open('http://www.flesko.com/annuaire/actualite_et_media/magazine/jeux_videos.php?idfr=4662');return false;">par Flesko.com</a></div>
    <!--NoScript flesko-->

    <a href="http://www.xiti.com/xiti.asp?s=222249" TARGET="_top">
    <script language="JavaScript1.1">
    <!--
    Xt_param = 's=222249&p=';
    Xt_r = document.referrer;
    Xt_h = new Date();
    Xt_i = '<img width="39" height="25" border=0 ';
    Xt_i += 'src="http://logv29.xiti.com/hit.xiti?'+Xt_param;
    Xt_i += '&hl=' + Xt_h.getHours() + 'x' + Xt_h.getMinutes() + 'x' + Xt_h.getSeconds();
    if(parseFloat(navigator.appVersion)>    =4)
    {Xt_s=screen;Xt_i += '&r=' + Xt_s.width + 'x' + Xt_s.height + 'x' + Xt_s.pixelDepth + 'x' + Xt_s.colorDepth;}
    document.writeln(Xt_i + '&ref='+Xt_r.replace(/[<>"]/g, '').replace(/&/g, '$')+'" title="Mesurez votre audience">');
    //-->
    </script>
    <noscript>
    Mesure d'audience ROI frequentation par <img width="39" height="25" border="0" src="http://logv29.xiti.com/hit.xiti?s=222249&p=&" title="Mesurez votre audience">
    </noscript></a><br/><br/>
    <p><a href="changer_design.php">Changer de design</a></p></div>
          </div>
      </div>
    </div>

    </body>
    </html>


    le CSS qui concerne le problème :
    #contenu {
            margin: -5px 16px 0px 170px;
            padding: 0 0 15px 0;
            height: auto;
            width: auto;
              background: #2f2f2f url(new_design/corps.png) repeat-y;
    }

    #bas{
    margin: -5px 16px 0px 170px;
    }


    la partie HTML du problème :

                    <img src="new_design/haut.png" alt="haut"/>
                    <div id="contenu">
    </div>
    <div id="bas">
                    <img src="new_design/bas.png" alt="bas"/>
                    </div>  


    SVP aidez moi , ça marche super sous firefox mais pas sous IE et ça me gêne !

    PS: oui je ne suis pas doué pour le CSS , pas besoin de m'écrire 30 posts avec "va revoir tes cours" :-°

    • Partager sur Facebook
    • Partager sur Twitter
    Marin74
    • HTML / CSS
      22 avril 2006 à 11:27:14

      Super design !
      J'aime bien. ^^

      Sinon, je vais te faire la remarque que tu attendais :)

      Revois les cours !
      lol, plus sérieusement, M@téo21 énonce clairement dans ses cours la merde qu'est Internet Explorer. IE n'a pas été mit à jour depuis bien longtemps et ne connaît pas certaines propriétés, certains trucs du CSS. C'est pourquoi ça merde (pour être poli) sur IE.

      Du moins je pense que le problème vient de là. :-(
      • Partager sur Facebook
      • Partager sur Twitter
      soulex
        22 avril 2006 à 11:30:30

        Citation : John Laury

        Du moins je pense que le problème vient de là. :-(



        Evidemment que le problème vient de la.
        IE sera bientot mis à jour mais d'ici la il faut trouver des petites astuces pour rendre compatible ton site sur les deux. En sachant très bien que tu n'auras jamais le même résultat sur IE et sur FF.

        A part si tu utilises les tableaux...
        • Partager sur Facebook
        • Partager sur Twitter
        JefGrailet
          22 avril 2006 à 11:36:49

          non , oubliez les tableaux svp , ça m'obligerais à tout recoder , faut trouver autre chose ... grrr , saleté d'IE ! quand c'est pas un , c'est l'autre ! :colere:

          Personne ne sait ?
          • Partager sur Facebook
          • Partager sur Twitter

          IE m'énerve ...

          × 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