Partage
  • Partager sur Facebook
  • Partager sur Twitter

souci avec IE

nikel sous FF mais pas sous IE

Grichka
  • HTML / CSS
    2 janvier 2006 à 2:45:02

    Voila, j'ai ouvert mon site sous IE (alors que j'utilise uniquement FF) pour vérifier si c'était nikel aussi, mais à ma grande surprise, c'est loin d'être le cas!

    http://bogdanov.free.fr/test/accueil.php

    ouvrez ce lien sous FF puis sous IE vous verrez! Le menu est tout bizarre sous IE et les blocs sont tous décalés! :/

    Voici 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" xml:lang="fr" >
       <head>
           <title>Bienvenue sur mon site !</title>
           <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
               <link rel="stylesheet" media="screen" type="text/css" title="Design sombre" href="metalique.css" />
       </head>
       <body>
       
       <div id="en_tete">
           </div>
       
       <div id="menu">
         <span class="accueil"><a href="accueil.php">Accueil</a></span>
             <span class="news"><a href="news.php">News</a></span>
             <span class="chroniques"<a href="chroniques.php">Chroniques</a></span>
             <span class="live_reports"<a href="live-reports.php">Live Reports</a></span>
             <span class="interviews"<a href="interviews.php">Interviews</a></span>
             <span class="staff"<a href="staff.php">Staff</a></span>
             <span class="liens"<a href="liens.php">Liens</a></span>
             <span class="forum"<a href="forum.php">Forum</a></span>
        </div>

       <div id="menu_gauche">
               
         <div class="menu_ajouts">
         </div>
             <div class="menu_ajoutsB">
             <a href="dernierajouts.php">Tout voir</a>
             </div>
               
         <div class="menu_cds">
           </div>
             <div class="menu_cdsB">
             <a href="sortiscds.php">Tout voir</a>
             </div>
               
         <div class="menu_concerts">
               </div>
             <div class="menu_concertsB">
             <a href="concerts.php">Tout voir</a>
             </div>
       </div>
               
       <div id="centre">
       <?php
    mysql_connect("localhost", "root", "");
    mysql_select_db("test");

    $retour = mysql_query('SELECT * FROM newsaccueil ORDER BY id DESC LIMIT 0, 15');
    while ($donnees = mysql_fetch_array($retour))
    {
    ?>
         <div class="news">
             <h3>
            <?php echo $donnees['titre']; ?>
                   
                   
        </h3>
       
        <p>
        <?php
        $contenu = nl2br(stripslashes($donnees['contenu']));
        echo $contenu;
        ?>
        </p>

        <h2>
        Par <em><?php echo $donnees['nom']; ?></em>
        <span class="test">le <?php echo date('d/m/Y', $donnees['timestamp']); ?></span>
            </h2>
            </div>
    <?php
    }
    ?>

         
    <div class="archives"><a href="archives.html">Voir archives</a>
             </div>
           </div>
               
       <div id="menu_droit">
               
             <div class="menu_forum">
             </div>
             
             <div class="menu_sondage">
                 </div>
               
             <div class="menu_style">
                 </div>
                     
             <div class="menu_stat">
                 </div>
                     
       </div>
       </html>


    et mon code css
    body
    {
       width: 1000px;
       height: 1210px;
       margin: auto;
       margin-top: 20px;
       background-color: #151515;
       background-image: url("Images/Fond.jpg");
       background-repeat: no-repeat;
       background-position: center;
    }
    a img
    {
       border: none;
    }

    #en_tete
    {
       width: 997px;
       height: 168px;
       margin-left: 2px;
       margin-bottom: 5px;
       background-image: url("Images/Header.jpg");
       background-repeat: no-repeat;
       background-position: center;
    }

    #menu
    {
       width: 997px;
       height: 30px;
       background-image: url("Images/Menu.jpg");
       margin-left: 2px;
       margin-bottom: 20px;
    }

    .accueil a
    {
       font-family: Impact;
       text-decoration: none;
       margin-left: 20px;
       margin-bottom: 3px;
       color: black;
       font-size: 24px;
    }

    .news a
    {
       font-family: "Impact", Arial;
       text-decoration: none;
       margin-left: 42px;
       margin-bottom: 3px;
       color: black;
       font-size: 24px;
    }

    .chroniques a
    {
       font-family: "Impact", Arial;
       text-decoration: none;
       margin-left: 42px;
       margin-bottom: 3px;
       color: black;
       font-size: 24px;
    }

    .live_reports a
    {
       font-family: "Impact", Arial;
       text-decoration: none;
       margin-left: 43px;
       margin-bottom: 3px;
       color: black;
       font-size: 24px;
    }

    .interviews a
    {
       font-family: "Impact", Arial;
       text-decoration: none;
       margin-left: 47px;
       margin-bottom: 3px;
       color: black;
       font-size: 24px;
    }

    .staff a
    {
       font-family: "Impact", Arial;
       text-decoration: none;
       margin-left: 52px;
       margin-bottom: 3px;
       color: black;
       font-size: 24px;
    }

    .liens a
    {
       font-family: "Impact", Arial;
       text-decoration: none;
       margin-left: 47px;
       margin-bottom: 3px;
       color: black;
       font-size: 24px;
    }

    .forum a
    {
       font-family: "Impact", Arial;
       text-decoration: none;
       margin-left: 38px;
       margin-bottom: 3px;
       color: black;
       font-size: 24px;
    }

    #menu a:hover
    {
       text-decoration: underline;
    }

    #menu_gauche
    {
       float: left;
       width: 206px;
       margin-left: 8px;
    }

    .menu_ajouts
    {
       width: 206px;
       height: 370px;
       margin-bottom: 0px;
       background-image: url("Images/DerniersAjouts.jpg");
       background-repeat: no-repeat;
    }

    .menu_ajoutsB
    {
       width: 206px;
       height: 22px;
       background-image: url("Images/DerniersAjoutsB.jpg");
       background-repeat: no-repeat;
       margin-bottom: 8px;
    }

    .menu_ajoutsB a
    {
       color: white;
       text-decoration: none;
       margin: auto;
       padding-left: 82px;
       font-family: arial;
       font-size: 10px;
    }

    .menu_ajoutsB a:hover
    {
       text-decoration: underline;
    }

    .menu_cds
    {
       Width: 206;
       height: 251px;
       background-image: url("Images/SortisCDs.jpg");
       background-repeat: no-repeat;
    }

    .menu_cdsB
    {
       width: 206px;
       height: 22px;
       background-image: url("Images/SortisCDsB.jpg");
       background-repeat: no-repeat;
       margin-bottom: 8px;
    }

    .menu_cdsB a
    {
       color: white;
       text-decoration: none;
       margin: auto;
       padding-left: 82px;
       font-family: arial;
       font-size: 10px;
    }

    .menu_cdsB a:hover
    {
       text-decoration: underline;
    }

    .menu_concerts
    {
        Width: 206px;
            height: 251px;
        background-image: url("Images/Concerts.jpg");
            background-repeat: no-repeat;
    }

    .menu_concertsB
    {
       width: 206px;
       height: 22px;
       background-image: url("Images/ConcertsB.jpg");
       background-repeat: no-repeat;
    }

    .menu_concertsB a
    {
       color: white;
       text-decoration: none;
       margin: auto;
       padding-left: 82px;
       font-family: arial;
       font-size: 10px;
    }

    .menu_concertsB a:hover
    {
       text-decoration: underline;
    }

    #centre
    {
        width: 558px;
            height: 950px;
        float: left;
            border: 2px solid black;
            background-color: #191919;
            background-repeat: no-repeat;
            margin-left: 6px;
            overflow: auto;
    }

    .news
    {

    }

    h3
    {
        margin-top: 0px;
            margin-left: 1px;
            margin-right: 0px;
            margin-bottom: 10px;
        height: 26px;
        width: 530px;
        padding-left: 7px;
            padding-top: 0px;
            padding-bottom: 0px;
            background-image: url("Images/barretitrenews.jpg");
            background-repeat: repeat-x;
            font-family: Times New Roman;
            font-size: 24px;
            color: black;
            text-align: left;
    }

    p
    {
        width: 94%;
            color: white;
            margin-left: 7px;
            font-size: 14px;
            font-family: Arial;
    }

    h2
    {
        margin-top: 0px;
            margin-left: 1px;
            margin-right: 0px;
            margin-bottom: 20px;
        height: 20px;
        width: 530px;
        padding-left: 7px;
            padding-top: 0px;
            padding-bottom: 0px;
            background-image: url("Images/barretitrenews2.jpg");
            background-repeat: repeat-x;
        font-size: 14px;
        color: black;
        font-family: Times New Roman;
    }

    .test
    {   
        padding-left: 3px;
        font-size: 13px;
    }


    .archives a
    {
        color: White;
            margin-left: 237px;
            text-decoration: none;
            font-family: Arial;
            font-size: 14px;
    }

    .archives a:hover
    {
       text-decoration: underline;
    }

    #menu_droite
    {
       float: left;
    }

    .menu_forum
    {
       margin-top: 20px;
       width: 206;
       height: 392px;
       margin-bottom: 8px;
       margin-right: 6px;
       background-image: url("Images/DerniersMessagesForum.jpg");
       background-repeat: no-repeat;
       background-position: right;
    }

    .menu_sondage
    {
       width: 200;
       height: 273px;
       margin-bottom: 8px;
       margin-right: 6px;
       background-image: url("Images/Sondage.jpg");
       background-repeat: no-repeat;
       background-position: right;
    }

    .menu_style
    {
       width: 206;
       height: 80px;
       margin-bottom: 8px;
       margin-right: 6px;
       background-image: url("Images/ChangementdeStyle.jpg");
       background-repeat: no-repeat;
       background-position: right;
    }

    .menu_stat
    {
       width: 206;
       height: 185px;
       margin-bottom: 8px;
       margin-right: 6px;
       background-image: url("Images/Statistiques.jpg");
       background-repeat: no-repeat;
       background-position: right;
    }


    Si quelqu'un peut me dire d'ou ca vient! :o
    Merci! ;)


    EDIT => Oups, j'viens de me rendre compte que j'ai posté dans PHP au lieu de HTML/CSS! Mille excuse! :euh:

    [02/01/06 - kokotchY] Je bouge dans xhtml ;)
    • Partager sur Facebook
    • Partager sur Twitter
    Finality
      2 janvier 2006 à 9:38:21

      Salut,
      regrade ton code, tu ne ferme pas les balises span :

      <div id="menu">
           <span class="accueil"><a href="accueil.php">Accueil</a></span>
               <span class="news"><a href="news.php">News</a></span>
               <span class="chroniques"><a href="chroniques.php">Chroniques</a></span>
               <span class="live_reports"><a href="live-reports.php">Live Reports</a></span>
               <span class="interviews"><a href="interviews.php">Interviews</a></span>
               <span class="staff"><a href="staff.php">Staff</a></span>
               <span class="liens"><a href="liens.php">Liens</a></span>
               <span class="forum"><a href="forum.php">Forum</a></span>
          </div>


      Essaie le code que je t'ai donné :)
      • Partager sur Facebook
      • Partager sur Twitter
      jp949
        2 janvier 2006 à 9:48:21

        et puis pourquoi une classe a chaque rubrique? fais une liste a puce
        • Partager sur Facebook
        • Partager sur Twitter

        souci avec 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