Partage
  • Partager sur Facebook
  • Partager sur Twitter

Problème d'affichage

Background Menu et header.

pclorraine
    25 décembre 2005 à 21:27:53

    Bonjour à tous et Joyeux Noël,

    Je viens demander votre aide qui me serait très précieuse car j'ai un problème qui me fait..... m'énerver :-°

    Voilà mon site sous Internet Explorer s'affiche très bien header flash qui tourne et background des titres de menu visible.

    Mais sous Firefox ce n'est pas la même histoire!

    Savez vous d'ou ceci peut venir?

    Est-ce normal? Faut t-il faire quelque chose de spécial?

    Merci par avance et voici un gros croquis qui risque de vous aider à m'aider.... :D

    <lien url="http://img333.imageshack.us/img333/4862/aide7mu.jpg"></lien>
    • Partager sur Facebook
    • Partager sur Twitter
    JulFisher
      25 décembre 2005 à 22:24:18

      Bein montre-nous ton code source, sans ça on risque pas de t'aider ;)
      • Partager sur Facebook
      • Partager sur Twitter
      pclorraine
        25 décembre 2005 à 23:13:05

        Désolé voilà, s'il vous faut d'autre infos n'hesitez pas.

        <body>
        <div id="englobe">
         <div id="header"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="724" height="229">
            <param name="movie" value="/themes/pclorraine/index.swf">
            <param name="quality" value="high">
            <embed src="index.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="724" height="229"></embed>
          </object></div>
                <div id="contenu">
                 <hr>
         <table cellpadding="0" cellspacing="0" width="715"><tr>
                                <td style="width:193px;">

        <div style="margin-left: 5px; width: 185px; margin-right: 5px;">

        <{foreach item=block from=$xoops_lblocks}>
        <div style="margin-left: 4px;background: url('<{$xoops_url}>/themes/pclorraine
        /menu.png')
        no-repeat; height:23px; width: 177px;"><!--Background des menus avec la ligne du dessus -->
        <div style="float: left; margin-top: 5px; margin-left:15px"><!-- Titre des menus -->
        <b><{$block.title}></b></div></div>
                <br /><{$block.content}><br />
        <{/foreach}></div></td><td>
        <div style="margin-left: 10px; width: 510px; margin-right: 5px;"><!--Background des titres des news -->
        <{foreach item=block from=$xoops_ccblocks}>
        <div style="margin-left: 4px;background: url('<{$xoops_url}>/themes/pclorraine
        /menu.gif') no-repeat; height:23px; width: 510px;">
        <div style="float: left; margin-top: 5px; margin-left:3px">
        <b><{$block.title}></b></div></div>
                <br /><{$block.content}><br /><{/foreach}>
        <{if $xoops_showcblock == 1}>
        <table style="width: 100%; height: auto"><tr>
        <td style="width: 50%;">
        <{foreach item=block from=$xoops_clblocks}>
        <div style="margin-left: 4px;background: url('<{$xoops_url}>        /themes/pclorraine
        /menu3.gif') no-repeat; height:23px; width: 230px;"><div style="float: left; margin-top: 5px; margin-left:3px"><b><{$block.title}></b></div></div>
                <br /><{$block.content}><br />
        <{/foreach}>
        </td><td style="width: 50%;">
        <{foreach item=block from=$xoops_crblocks}>
        <div style="margin-left: 4px;background: url('<{$xoops_url}>/themes/pclorraine
        /menu3.gif') no-repeat; height:23px; width: 230px;"><div style="float: left; margin-top: 5px; margin-left:3px"><b><{$block.title}></b></div></div>
                <br /><{$block.content}><br />
        <{/foreach}>
        </td>
        </tr>
        </table><{/if}><{$xoops_contents}></div></tr></table>
          </div>


        body { 
                padding:0;
                margin:0;
            color:#414141;
            background:#7B7B7B url('images/background.jpg') repeat-x;
                font-size: 11px; 
                font-family: Verdana;
        }

        img{
                border: 0px;
        }

        #menu_img{
        float: left;
                background: url('images/menu.gif') no-repeat; height:24px; width: 115px;
        }
        #menu_texte{
        color: #FFFFFF; margin-top: 4px; text-align: center; margin-right:15px;
        }

        #menu_texte a{
        color: #FFFFFF;
        }
        table {
                margin: 0;
                padding: 0;
                font-size: 11px
        }
        #menu {
        position: absolute; left: 77px; top: 191px; width: 590px}
        input {
                font-family:Verdana, Arial, Helvetica, sans-serif;
                font-size:9px;
                background: transparent;
                border: 1px solid silver;
        }
        select,textarea{
                font-family:Verdana, Arial, Helvetica, sans-serif;
                font-size:9px;
                        border: 1px solid silver;
        }
        table td
        {
                padding: 0;
                border-width: 0;
                vertical-align: top;
                font-family:
                Verdana;
        }
        #englobe{
                position: absolute;
                width: 724px;
                margin-left: -360px;
                left: 50%;
                top: 0px;
                height : auto;
        }

        #header{
        margin-bottom: 0px;
        }

        #contenu{
                background:url(images/milieu.jpg) repeat-y;
                        height: auto;
                        margin-top: 0px;
        }


        #header {
                        width:724px;
                height:229px;
        }


        a {
                color: #414141;
                text-decoration: none;
                background-color: transparent;
        }

        a:hover {
                text-decoration: none;
                color: #000099;
        }
        a:active {
                text-decoration: none;
        }

        .item {border: 0px;}
        .itemHead {padding-top:6px; font-style:bold; float: left;background:url('menu.gif') no-repeat; height:23px; width:510px; margin-left:1px; padding-left: 7px;}
        .itemInfo {text-align: right; padding: 3px;     background-image: ;}
        .itemPoster {font-size: 85%; font-style:italic;}
        .itemPostDate {font-size: 85%; font-style:italic;}
        .itemStats {font-size: 85%; font-style:italic;}
        .itemBody {padding-left: 0px;background-image:}
        .itemText {padding: 5px; margin-top: 0px; margin-bottom: 0px; line-height:1.5em;         text-align: justify;}
        .itemText:first-letter {font-size: 155%; font-weight: bold;}
        .itemFoot {text-align: right; padding: 3px;     }
        .itemAdminLink {font-size: 10px;}
        .itemPermaLink {font-size: 10px;}
        .itemTitle a {font-size: 98%; font-weight: bold; }
        th {background:url('menu_2.gif') repeat-x; height:23px; padding : 2px; vertical-align : middle; font-family: Verdana, Arial, Helvetica, sans-serif;}
        .head a{
        color: #FFFFFF;
        }
        .outer {border: 1px solid silver;}
        .head {background:#221dc1; padding: 5px; color: #ffffff; font-weight: bold;}
        .even {background-color: #F5F6FA; padding: 5px;}
        .odd {background-color: #F5F6FA; padding: 5px;}
        .foot {background-color: #F5F6FA; padding: 5px; font-weight: bold;}

        tr.even td {background-color: #F5F6FA; padding: 5px;}
        tr.odd td {background-color: #F5F6FA; padding: 5px;}
        div.errorMsg { background-color: #FFCCCC; text-align: center; border-top: 1px solid #DDDDFF; border-left: 1px solid #DDDDFF; border-right: 1px solid #AAAAAA; border-bottom: 1px solid #AAAAAA; font-weight: bold; padding: 10px;}
        div.confirmMsg { background-color: #DDFFDF; color: #136C99; text-align: center; border-top: 1px solid #DDDDFF; border-left: 1px solid #DDDDFF; border-right: 1px solid #AAAAAA; border-bottom: 1px solid #AAAAAA; font-weight: bold; padding: 10px;}
        div.resultMsg { background-color : #CCCCCC; color: #333333; text-align: center; border-top: 1px solid silver; border-left: 1px solid silver; font-weight: bold; border-right: 1px solid #666666; border-bottom: 1px solid #666666; padding: 10px;}
        div.xoopsCode { background: #FFFFFF; border: 1px inset #000080; font-family: "Courier New",Courier,monospace; margin : 0;px 6px 6px 6px;}
        div.xoopsQuote { background: #FFFFFF; border: 1px inset #000080; font-family: "Courier New",Courier,monospace; margin : 0;px 6px 6px 6px;}

        .comTitle {font-weight: bold; margin-bottom: 2px;}
        .comText {padding: 2px;}
        .comUserStat {font-size: 10px; color: #808080; font-weight:bold; border: 1px solid silver; background-color: #ffffff; margin: 2px; padding: 2px;}
        .comUserStatCaption {font-weight: normal;}
        .comUserStatus {margin-left: 2px; margin-top: 10px; color: #808080; font-weight:bold; font-size: 10px;}
        .comUserRank {margin: 2px;}
        .comUserRankText {font-size: 10px;font-weight:bold;}
        .comUserRankImg {border: 0px none;}
        .comUserName {}
        .comUserImg {margin: 2px;}
        .comDate {font-weight: normal; font-style: italic;}
        .comDateCaption {font-weight: bold; font-style: normal;}
        • Partager sur Facebook
        • Partager sur Twitter
        pclorraine
          26 décembre 2005 à 21:56:59

          Bonsoir,

          Escusez moi de relancer mon problème mais j'ai vraiment besoins d'une solution.

          Merci d'avance.
          • Partager sur Facebook
          • Partager sur Twitter
          JulFisher
            27 décembre 2005 à 9:42:04

            Donne-nous ton code html sans le PHP : affiche le code source une fois la page générée.
            • Partager sur Facebook
            • Partager sur Twitter
            pclorraine
              27 décembre 2005 à 10:54:09

              Voilà le code source sous Firefox

              <body>
              <div id="englobe">
               <div id="header"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="724" height="229">
                  <param name="movie" value="/themes/pclorraine/index.swf">
                  <param name="quality" value="high">
                  <embed src="index.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="724" height="229"></embed>
                </object></div>
                      <div id="contenu">
                       <hr>

               <table cellpadding="0" cellspacing="0" width="715"><tr>
                                      <td style="width:193px;">

              <div style="margin-left: 5px; width: 185px; margin-right: 5px;">

              <div style="margin-left: 4px;background: url('http://www.pclorraine.com/themes/pclorraine
              /menu.png')
              no-repeat; height:23px; width: 177px;"              >              <!--Background des menus avec la ligne du dessus -->
              <div style="float: left; margin-top: 5px; margin-left:15px"><!-- Titre des menus -->
              <b>Menu utilisateur</b></div></div>
                      <br /><table cellspacing="0">
                <tr>
                  <td id="usermenu">

                    <a class="menuTop" href="http://www.pclorraine.com/user.php">Voir son compte</a>
                    <a href="http://www.pclorraine.com/edituser.php">Editer son compte</a>
                    <a href="http://www.pclorraine.com/notifications.php">Notifications</a>
                    <a href="http://www.pclorraine.com/user.php?op=logout">D&eacute;connexion</a>
                            <a href="http://www.pclorraine.com/viewpmsg.php">Messages</a>
                   
                            <a href="http://www.pclorraine.com/admin.php">Administration</a>

                        </td>
                </tr>
              </table><br />
              <div style="margin-left: 4px;background: url('http://www.pclorraine.com/themes/pclorraine
              /menu.png')
              no-repeat; height:23px; width: 177px;"              >              <!--Background des menus avec la ligne du dessus -->
              <div style="float: left; margin-top: 5px; margin-left:15px"><!-- Titre des menus -->
              <b>Menu principal</b></div></div>
                      <br /><table cellspacing="0">
                <tr>
                  <td id="mainmenu">
                    <a class="menuTop" href="http://www.pclorraine.com/">Accueil</a>

                    <!-- start module menu loop -->
                          <a class="menuMain" href="http://www.pclorraine.com/modules/extcal/">Calendrier</a>
                                  <a class="menuMain" href="http://www.pclorraine.com/modules/news/">News</a>
                                <a class="menuSub" href="http://www.pclorraine.com/modules/news/archive.php">Archives</a>
                                <a class="menuSub" href="http://www.pclorraine.com/modules/news/submit.php">Proposer un article</a>
                                  <a class="menuMain" href="http://www.pclorraine.com/modules/contact/">Contactez-nous</a>

                                  <a class="menuMain" href="http://www.pclorraine.com/modules/xoopsmembers/">Membres</a>
                                  <a class="menuMain" href="http://www.pclorraine.com/modules/xoopspartners/">Partenaires</a>
                                  <!-- end module menu loop -->
                  </td>
                </tr>
              </table><br />
              <div style="margin-left: 4px;background: url('http://www.pclorraine.com/themes/pclorraine
              /menu.png')
              no-repeat; height:23px; width: 177px;"              >              <!--Background des menus avec la ligne du dessus -->
              <div style="float: left; margin-top: 5px; margin-left:15px"><!-- Titre des menus -->
              <b>L&#039;association</b></div></div>

                      <br />  <table cellspacing="0" cellspading="0">
              <tr>
              <td id="mainmenu">
                     
                    <a class="menuTop" href="http://www.pclorraine.com/" >Accueil</a>

               
              <a class="menuMain" href="http://www.pclorraine.com/modules/extcal/" >Calendrier</a>
               
              <a class="menuMain" href="http://www.pclorraine.com/pages/association.php" >Services</a>
               
              <a class="menuMain" href="http://www.pclorraine.com/modules/contact/" >Contactez-nous</a>

               
              <a class="menuMain" href="http://www.pclorraine.com/modules/xoopspartners/" >Partenaires</a>
              </td>
              </tr>
              </table>
              <br />
              </div></td><td>
              <div style="margin-left: 10px; width: 510px; margin-right: 5px;"><!--Background des titres des news -->



              <div style="margin: 10px;"></div>
              <table width='100%' border='0'>
              <tr>
                              <td width="100%"><table cellpadding="0" cellspacing="0" class="item">

              <tr>
                      <td>
                              <table cellpadding="0" cellspacing="0" width="98%">
                              <tr>
                                      <td class="itemHead"><span class="itemTitle"><a href='http://www.pclorraine.com/modules/news/index.php?storytopic=2'>Association PC Lorraine</a>&nbsp;:&nbsp;<a href='http://www.pclorraine.com/modules/news/article.php?storyid=1'>Enfin la création</a></span></td>
                              </tr>
                              <tr>
                                      <td class="itemInfo"><span class="itemPoster">Post&eacute; par <a href='http://www.pclorraine.com/userinfo.php?uid=1'>Joseph</a></span> <span class="itemPostDate">le 05-11-25 16:30</span> (<span class="itemStats">0 lectures</span>) </td>

                              </tr>
                              <tr>
                                     
                              </tr>
                              <tr>
                                      <td class="itemFoot"><span class="itemAdminLink">&nbsp;[ <a href='http://www.pclorraine.com/modules/news/submit.php?op=edit&amp;storyid=1'>Editer</a> | <a href='http://www.pclorraine.com/modules/news/admin/index.php?op=delete&amp;storyid=1'>Effacer</a> ]&nbsp;</span><span class="itemPermaLink"><a href="http://www.pclorraine.com/modules/news/article.php?storyid=1">Commentaires ?</a></span></td>
                              </tr>
                              </table>

                      </td>
              </tr>
              </table></td>
                      </tr>
              </table>

              <div style="text-align: right; margin: 10px;"></div>
              </div></tr></table>
                </div>
                      <div id="contenu" style="text-align: center">
                     
                     
                     
                      </br>
                      </br>

                      </br>
                      </br>
                      <hr><!-- Barre au dessus du footer -->
                      <div style="margin-left:110px;<span class="copyright">Copyright pclorraine © 2005 <a href="http://www.pclorraine.com/" target="_blank">Pc Lorraine - Junior Association</a></span></div>
                      </br></div>
              </div>

              </body>
              </html> 
              • Partager sur Facebook
              • Partager sur Twitter
              scaler
                27 décembre 2005 à 11:36:19

                salut,

                Peut on savoir quel doctype tu utilises ?

                ++
                • Partager sur Facebook
                • Partager sur Twitter
                JulFisher
                  27 décembre 2005 à 12:11:59

                  Pour l'animation flash, utilise cette méthode déjà : http://siteduzero.com/forum-83-6123-54603.html#r54603

                  Et dans ton pied de page à la fin, tu as oublié de refermer un guillement du style ;)

                  Pour tes backgrounds, essaie comme ceci :

                  <div style="margin-left: 4px;background-image: url("http://www.pclorraine.com/themes/pclorraine/menu.png"); background-repeat: no-repeat; height:23px; width: 177px;">


                  Donc en évitant le retour à la ligne dans l'adresse de l'image, et en séparant les 2 valeurs dans 2 paramètres différents. Le mieux serait quand même de créer une class pour ton CSS externe ;)
                  • Partager sur Facebook
                  • Partager sur Twitter
                  pclorraine
                    27 décembre 2005 à 18:52:59

                    Merci beaucoup JulFisher pour ton aide me voilà sauvé.

                    Deux derniéres questions.

                    Comment enlever l'éspace, qu'il n'y a pas sous IE, entre "LE HEADER" -> "LES MENU&LE CORPS"

                    Et pour terminer qu'est ce que ca change de mettre le Css dans un fichier Externet, question de vitesse ou validation?
                    • Partager sur Facebook
                    • Partager sur Twitter
                    JulFisher
                      27 décembre 2005 à 19:43:18

                      Plutôt vitesse et pratique : si tu veux modifier un style, il va falloir que tu le modifies sur toutes tes pages, alors qu'avec un même fichier externe pour toutes tes pages, une seule modification et c'est fait. Et ta page sera moins lourde au niveau du code.

                      Pour l'espace, je ne sais pas, ça peut venir des tableaux, mais je ne les utilise que très rarement.
                      • Partager sur Facebook
                      • Partager sur Twitter

                      Problème d'affichage

                      × 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