Partage
  • Partager sur Facebook
  • Partager sur Twitter

Découpe d'un design

Problème :x

Jojo
    17 mars 2006 à 18:18:29

    Bonjour,

    Je suis actuellement entrain de découper un design, j'ai 2 petites erreurs, si vous pouviez m'aider a les corriger.

    Voici un screen:
    Cliquez ici

    Voila, déja en premier lieu comme vous le voyez, mon texte dépasse sur la bordure à droite, j'ai essayé un padding-right:40px; mais mon texte ne bouge pas !
    Mon seconde problème, c'est que mon menu a gauche ne suit pas, comme vous le voyez, en dessous du bouton "Contact", il y a un blanc.

    Voici mon code XHTML:
    <!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>Decoupe</title>
    <meta http–equiv="Content–Type" content="text/html; charset=iso–8859–1" />
    <link href="css.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <!-- Header -->
    <div id="header"></div>

    <!-- Le Menu -->
    <div class="bouton"><img src="images/accueil.jpg" alt="Accueil" />
    <img src="images/creations.jpg" alt="Creations" />
    <img src="images/profil.jpg" alt="Profil" />
    <img src="images/tutoriaux.jpg" alt="Tutoriaux" />
    <img src="images/livredor.jpg" alt="Livre D'or" />
    <img src="images/monsite.jpg" alt="Mon Site" />
    <img src="images/partenaires.jpg" alt="Partenaires" />
    <img src="images/contact.jpg" alt="Contact" /></div>

    <div class="corp_menu"></div>

    <!-- Le Corp -->
    <div class="corp">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
    </div>

    <div id="footer"></div>
    </body>
    </html>


    Et mon code CSS:
    #header
    {
    background-image:url(images/header.jpg);
    width:759px;
    height:228px;
    background-repeat:no-repeat;
    }

    .bouton
    {
    padding:0px;
    white-space:pre;
    }

    .corp_menu
    {
    background-image:url(images/corp_menu.jpg);
    width:186px;
    background-repeat:repeat-y;
    }

    .corp
    {
    background-image:url(images/corp.jpg);
    width:573px;
    background-repeat:repeat-y;
    margin-left:186px;
    margin-top:-336px;
    padding:10px;
    padding-right:40px;
    }

    #footer
    {
    background-image:url(images/footer.jpg);
    width:768px;
    height:116px;
    background-repeat:no-repeat;
    }


    Voila, je ne vois pas pourquoi j'ai mes deux erreurs :(

    A+
    • Partager sur Facebook
    • Partager sur Twitter
    kagemusha kazekage
      17 mars 2006 à 19:03:52

      bonne chance maitre :-°
      • Partager sur Facebook
      • Partager sur Twitter
      Jojo
        17 mars 2006 à 19:42:11

        Personne ne sait comment faire ?

        A+
        • Partager sur Facebook
        • Partager sur Twitter
        Maitre Juin
          17 mars 2006 à 22:21:49

          Créer #conteneur{<display:table>} et #menu, #corps{height:100%;} dans ton css puis en html :

          <div id="conteneur">
          <div id="menu">
          </div>
          <div id="corps">
          </div>
          </div>

          :)
          • Partager sur Facebook
          • Partager sur Twitter
          Jojo
            17 mars 2006 à 22:30:55

            Salut,

            Rien de tout cela ne fonctionne :(

            A+
            • Partager sur Facebook
            • Partager sur Twitter
            Creatol
              17 mars 2006 à 22:36:08

              Au lieux de padding-right essaye margin-right sur le corp
              • Partager sur Facebook
              • Partager sur Twitter
              Jojo
                18 mars 2006 à 19:10:27

                Non cela ne fonctionne pas

                A+
                • Partager sur Facebook
                • Partager sur Twitter
                Maitre Juin
                  18 mars 2006 à 21:36:57

                  http://www.siteduzero.com/forum-83-26185-mon-design.html

                  ...Celui qui a fait ce post avait le même problême d'ajustement pour sa colonne "menu" qui ne rejoignait pas son "footer".

                  A priori, la méthode du <display:table> a réglé son problême et devrait régler le tien aussi ;) ... Cherches un peu plus...
                  • Partager sur Facebook
                  • Partager sur Twitter
                  jp949
                    19 mars 2006 à 7:35:56

                    donne une largeur a #corp p widht:90%; margin:auto;
                    • Partager sur Facebook
                    • Partager sur Twitter
                    Jojo
                      19 mars 2006 à 10:19:31

                      Maitre Juin, pour ne pas paraittre impolis, tu as remarquer que le moteur de recherche avait disparut du site ...

                      Pour le texte, tout est Ok, mais le menu a gauche ne veut toujours pas se "déplier" ^^ Malgré le display:table; :(

                      A+
                      • Partager sur Facebook
                      • Partager sur Twitter

                      Découpe d'un design

                      × 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