Partage
  • Partager sur Facebook
  • Partager sur Twitter

Aidez moi

mon site c'est devenu nimporte quoi

KLiQ
    15 décembre 2005 à 21:58:28

    Bonjour, donc voila je suis en train de faire un stei. Tout allez bien et la jai insseré une image de fond et la c'est la pagaille...

    http://annugratos.free.fr Voici l'url du site.


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
       <head>
           <title>Tout et Rien - Acceuil</title>
           <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
                         <link rel="stylesheet" media="screen" type="text/css" title="style" href="nba.css" />
                 <link rel="alternate stylesheet" media="screen" type="text/css" title="nba" href="style.css" />
       </head>

       <body>

           <!-- L'en-tête -->

           <div id="en_tete">
           
           </div>
          <!-- Les menus -->

              
              
                    <div id="maison">       
               <div class="element_maison">
                   
                   <ul>
                       <li><a href="index.html">Acceuil</a></li>
                       <li><a href="histoire.html">Histoire du site</a></li>
                       <li><a href="team.html">La Team</a></li>
                   </ul>
               </div>
                   </div>
                              
                              
     <div id="toutetrien">   
                             <div class="element_toutetrien">
                                  <ul>
                       <li><a href="inutile.html">L'Inutile</a></li>
                       <li><a href="top10.html">Top 10</a></li>
                       <li><a href="coin_perso.html">Coin perso</a></li>
                       <li><a href="sos.html">SOS recherche</a></li>
                               </ul>
               </div>
      </div>
     
     
                        <div id="goodies">   
                      <div class="element_goodies">
                   
                   <ul>
                       <li><a href="page1.html">Forum</a></li>
                       <li><a href="page2.html">Livre d'or</a></li>
                       <li><a href="page3.html">Partenaires</a></li>
                   </ul>
               </div>
                   


              </div>
              
              
       
                <div id="ipod">       
             
    <div class="element_ipod">
                 
                <ul>
                       <li><a href="descriptions.html">Descriptions</a></li>
                       <li><a href="astuces.html">Astuces</a></li>
                     
                   </ul>
               </div>
                          </div>
                           
                            <div id="fourire">   
                      <div class="element_fourire">
                 
                   <ul>
                       <li><a href="histoires.html">Histoires</a></li>
                       <li><a href="blagues.html">Blagues</a></li>
                       <li><a href="animations.html">Animations</a></li>
                   </ul>
               </div>
                       </div>
                    
                     <div id="validation">   
                  <div class="element_validation">
                   
                   <p>
        <a href="http://validator.w3.org/check?uri=referer"><img
            src="http://www.w3.org/Icons/valid-xhtml11"
            alt="Valid XHTML 1.1" height="31" width="88" />    </a>
      </p>
      <p>
     <a href="http://jigsaw.w3.org/css-validator/">
      <img style="border:0;width:88px;height:31px"
           src="http://jigsaw.w3.org/css-validator/images/vcss"
           alt="Valid CSS!" />
     </a>
    </p>
               </div>
           </div>

           <!-- Le corps -->

           <div id="corps">
               <p><h5>Edito :</h5> Bienvenue sur "Tout et Rien", le site ou on parle de tout et rien. Comme vous avez put l'apercevoir, le menu est vaste de sujet et j'espere que vous allez y trouver votre bonheur!<br/>Dans les menus de gauches, il y a tout ce qui se rapporte au site et un petit jeux simpas que vous prendrai la peine de decouvrir "le tout et rien" :D . Dans mes menus de droites, ils y a plein de trucs diverses comme ipod ou autre. C'est le coin divertissement oou chacun pourra trouver quelque chose qui lui plait. <br/> Pour les fana' du site, il y a un forum ou vous pourrez vous rassembler pour parler de diverse chose .<br/> Voila en esperant vous avoir donner envie, votre WebmasteR  *ASK*
           
               
                 
                 
     
                               <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>
               </p>
           </div>

           <!-- Le pied de page -->

           <div id="pied_de_page">

                      
                       <p>Copyright "Tout et Rien" 2005, tous droits réservés</p>
           </div>

       </body>
    </html>



     body
    {
       width: 760px;
       margin: auto;
       margin-top: 20px;
       margin-bottom: 20px;   
       background-color: #e5f3f3;
    }

    /* L'en-tête */

    #en_tete
    {
       width: 760px;
       height: 100px;
       background-image: url("images/header.jpg");
       background-repeat: no-repeat;
       margin-bottom: 10px;
      border: 2px ridge black;
       
       }


    /* Le menu */

    #maison
    {
       float: left;
       width: 120px;
    }

    .element_maison
    {
       background-color: #e5f3f3;
       background-image: url("images/maison.gif");
       background-repeat: repeat-x;
       
       border: 2px ridge black;
       
       margin-bottom: 20px;
    }


    /* Quelques effets sur les menus */


    .element_maison h3
    {   
       color: black;
       font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
       text-align: center;
       border-bottom: medium dashed black;
       }

    .element_maison b
    {
    color: red;

    }

    .element_maison ul
    {
       list-style-image: url("images/puce.png");
       padding: 0px;
       padding-left: 5px;
       margin: 0px;
       margin-bottom: 5px;
    list-style-type: none;
       }

    .element_maison a
    {
       color: black;
    text-decoration: none;

       }



    #touetrien
    {
       clear: left;
       width: 120px;
    }

    .element_toutetrien
    {
       background-color: #e5f3f3;
       background-image: url("images/tout.gif");
       background-repeat: x-repeat;
       
       border: 2px ridge black;
       
       margin-bottom: 20px;
    }


    /* Quelques effets sur les menus */


    .element_touetrien h3
    {   
       color: black;
       font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
       text-align: center;
       border-bottom: medium dashed black;
       }

    .element_touetrien b
    {
    color: red;

    }

    .element_touetrien ul
    {
       list-style-image: url("images/puce.png");
       padding: 0px;
       padding-left: 5px;
       margin: 0px;
       margin-bottom: 5px;
    list-style-type: none;
       }

    .element_touetrien a
    {
       color: black;
    text-decoration: none;

       }

    #goodies
    {
       clear: left;
       width: 120px;
    }

    .element_goodies
    {
       background-color: #e5f3f3;
       background-image: url("images/goodies.gif");
       background-repeat: repeat-x;
       
       border: 2px ridge black;
       
       margin-bottom: 20px;
    }


    /* Quelques effets sur les menus */


    .element_goodies h3
    {   
       color: black;
       font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
       text-align: center;
       border-bottom: medium dashed black;
       }

    .element_goodies b
    {
    color: red;

    }

    .element_goodies ul
    {
       list-style-image: url("images/puce.png");
       padding: 0px;
       padding-left: 5px;
       margin: 0px;
       margin-bottom: 5px;
    list-style-type: none;
       }

    .element_goodies a
    {
       color: black;
    text-decoration: none;

       }

    #ipod
    {
       float: right;
       width: 120px;
    }

    .element_ipod
    {
       background-color: #e5f3f3;
       background-image: url("images/ipod.gif");
       background-repeat: repeat-x;
       
       border: 2px ridge black;
       
       margin-bottom: 20px;
    }


    /* Quelques effets sur les menus */


    .element_ipod h3
    {   
       color: black;
       font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
       text-align: center;
       border-bottom: medium dashed black;
       }

    .element_ipod b
    {
    color: red;

    }

    .element_ipod ul
    {
       list-style-image: url("images/puce.png");
       padding: 0px;
       padding-left: 5px;
       margin: 0px;
       margin-bottom: 5px;
    list-style-type: none;
       }

    .element_ipod a
    {
       color: black;
    text-decoration: none;

       }

    #fourire
    {
       clear: right;
       width: 120px;
    }

    .element_fourire
    {
       background-color: #e5f3f3;
       background-image: url("images/fourire.gif");
       background-repeat: repeat-x;
       
       border: 2px ridge black;
       
       margin-bottom: 20px;
    }


    /* Quelques effets sur les menus */


    .element_fourire h3
    {   
       color: black;
       font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
       text-align: center;
       border-bottom: medium dashed black;
       }

    .element_fourire b
    {
    color: red;

    }

    .element_fourire ul
    {
       list-style-image: url("images/puce.png");
       padding: 0px;
       padding-left: 5px;
       margin: 0px;
       margin-bottom: 5px;
    list-style-type: none;
       }

    .element_fourire a
    {
       color: black;
    text-decoration: none;

       }

    #validation
    {
       clear: right;
       width: 120px;
    }

    .element_validation
    {
       background-color: #e5f3f3;
       background-image: url("images/vali.gif");
       background-repeat: repeat-x;
       
       border: 2px ridge black;
       
       margin-bottom: 20px;
    }


    /* Quelques effets sur les menus */


    .element_validation h3
    {   
       color: black;
       font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
       text-align: center;
       border-bottom: medium dashed black;
       }

    .element_validation b
    {
    color: red;

    }

    .element_validation ul
    {
       list-style-image: url("images/puce.png");
       padding: 0px;
       padding-left: 5px;
       margin: 0px;
       margin-bottom: 5px;
    list-style-type: none;
       }

    .element_validation a
    {
       color: black;
    text-decoration: none;

       }



    /* Le corps de la page */

    #corps
    {
       margin-right: 140px;
       margin-left: 140px;
       margin-bottom: 20px;
       padding: 5px;
       
       color: black;
       background-color: #e5f3f3;
       background-image: url("images/motif.png");
       background-repeat: repeat-x;
       
       border-top: 2px dashed black;
       border-bottom: 2px dashed black;
       border-left:  2px dashed black;
       border-right: 2px dashed black;
    }

    #corps h1
    {
       color: black;
       text-align: center;
       font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
    }

    #corps h2
    {
       height: 30px;

       background-image: url("images/titre.png");
       background-repeat: no-repeat;
       
       padding-left: 30px;
       color: black;
       text-align: left;
    }

    #corps caption
    {
       caption-side: bottom; /* Le titre sera placé en bas du tableau (ne marche pas sur Internet Explorer) */
       margin: auto;
       font-family: Arial, Times, "Times New Roman", serif;
       font-weight: bold;
       font-size: 1.2em;
       color: #OOOOOO;
       margin-top: 20px; /* La marge doit se faire au-dessus et non en-dessous maintenant */
    }

    #corps table
    {
       margin: auto;
       border: 3px ridge #4791f1;
       border-collapse: collapse;
    }

    #corps th
    {
       background-color: #4791f1;
       color: white;
       font-size: 1.1em;
       font-family: Arial, "Arial Black", Times, "Times New Roman", serif;
    }

    #corps td
    {
       height: 20px; /* J'agrandis la hauteur des cellules pour que l'on puisse voir l'alignement vertical */
       vertical-align: bottom; /* Alignement vertical, le contenu des cellules sera placé en bas */
       border: 1px ridge #4791f1;
       font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;
       text-align: center;
       padding: 5px;
    }
    /* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

    #pied_de_page
    {
       padding: 5px;

       text-align: center;

       color: black;
       background-color: #e5f3f3;
       background-image: url("images/motif.png");
       background-repeat: repeat-x;
       
       border: 2px ridge black;
    }


    • Partager sur Facebook
    • Partager sur Twitter
    Zazou
    • HTML / CSS
      15 décembre 2005 à 22:24:38

      Un truc, d'après ton CSS tu as 36 menu et sous-menu, erreur fatal.

      Si je peux te conseiller je te dirais de faire un menu qui sera simplement à gauche ou à droite selon ton besoin et tout tes sous-menu dans ce menu géant en gros



      <div id="menu">
        <div class="sous_menu1">
           <li></li>
           <li></li>
           etc
        </div>
        <div class="sous_menu2">
           <li></li>
           <li></li>
           etc
        </div>
           etc etc
      </div>


      Au besoin, numérote tes sous_menu.

      Ensuite dans ton CSS tu auras


      #menu {
         float: left;
         width: 150px;
      }
      .sous_menu {
          ...
          ...
      }


      J'ai traficoté ton code. Je suppose que tu recherches à avoir ceci:

      http://dudu78.hebergement-pro.org/toutetrien/toutetrien.htm
      • Partager sur Facebook
      • Partager sur Twitter
      KLiQ
        16 décembre 2005 à 16:58:39

        merci beaucoup :D je n'ai rien a dire :p

        en fait si je pourrait savoir dans le code css comment ta fait puor que les liens de menus soit en dessous des images...?
        • Partager sur Facebook
        • Partager sur Twitter

        Aidez moi

        × 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