Partage
  • Partager sur Facebook
  • Partager sur Twitter

[xHTML] Ces <div>'s : Stop, je pète un câble !!!!

Comment en aligner trois, extensible en haut et en largeur et qu'ils fassent la même taille par apport à celui du milieu ?

Sujet résolu
    17 juin 2006 à 18:02:02

    Salut !

    Je découpe un design extensible mais ces purées de <div> me font péter un câble !
    Comment en aligner trois, extensible en haut et en largeur et qu'ils fassent la même taille par apport à celui du milieu ?
    La je penses qu'il aucune solution ou alors je suis un nul !

    Voici mes codes :

    xHTML :

    <div id="corps">
            <div id="corps_gauche"></div>
            <div id="corps_droite"></div>
            <div id="corps_centre">
                    <p>
                            Lorem ipsum dolor sit amet consectetuer ipsum vestibulum In ac Ut. Egestas massa quis massa Quisque nulla eget ut sit leo hendrerit. Semper Duis Maecenas nunc sed ac Curabitur venenatis felis massa metus. Id lobortis convallis pede Vestibulum sem nascetur laoreet eu magna pretium. Ipsum felis Ut dolor magna Vestibulum felis.
                            <br /><br />
                            In orci leo tortor ac In dolor justo accumsan id condimentum. Facilisi leo porttitor sollicitudin Maecenas at nec Nullam Nam Curabitur nibh. Pellentesque Aenean Curabitur rutrum nibh nulla Quisque feugiat hendrerit wisi elit. Consequat at Vestibulum ante quis sit tortor neque congue non auctor. Sed id eget sed Nam pede purus ac justo in Duis. Fringilla Curabitur enim mus ligula orci at ipsum vitae.
                            <br /><br />
                            Enim adipiscing urna eget a sit Cras Vestibulum magna et adipiscing. Interdum mi libero pellentesque eget Nam Curabitur magnis enim laoreet ut. Et nec et sed ac mattis Integer laoreet id adipiscing fringilla. Eget ut pede consequat quis justo sem sit neque nulla ante. Mauris accumsan tempus Nulla Nulla Aliquam in nibh.
                            <br /><br />
                            Augue condimentum semper Curabitur lobortis tincidunt Nunc Curabitur convallis pretium tortor. Tempor Curabitur montes lobortis est Aliquam nec odio Phasellus ante Sed. Habitasse accumsan In eu aliquam dui id Vestibulum et ipsum tristique. Orci sodales Nam elit enim ultrices justo vitae pretium cursus felis. Sagittis habitant Ut Cras sagittis dictumst Curabitur ipsum pretium Lorem hac. Consequat.
                            <br /><br />
                            Lorem ipsum dolor sit amet consectetuer ipsum vestibulum In ac Ut. Egestas massa quis massa Quisque nulla eget ut sit leo hendrerit. Semper Duis Maecenas nunc sed ac Curabitur venenatis felis massa metus. Id lobortis convallis pede Vestibulum sem nascetur laoreet eu magna pretium. Ipsum felis Ut dolor magna Vestibulum felis.
                            <br /><br />
                            In orci leo tortor ac In dolor justo accumsan id condimentum. Facilisi leo porttitor sollicitudin Maecenas at nec Nullam Nam Curabitur nibh. Pellentesque Aenean Curabitur rutrum nibh nulla Quisque feugiat hendrerit wisi elit. Consequat at Vestibulum ante quis sit tortor neque congue non auctor. Sed id eget sed Nam pede purus ac justo in Duis. Fringilla Curabitur enim mus ligula orci at ipsum vitae.
                            <br /><br />
                            Et voici la belle page avec plein de Lorem qui se termine ! Eh oui déjà !<br />
                            Mais bon, on s’en tape c’est juste pour faire joli ! ^^
                    </p>
            </div>
    </div>


    CSS :

    #corps {
            width: 92%;
            margin: auto;
            color: #404040;
            background-color: white;
    }

    #corps_gauche {
            position: absolute;
            left: 4%;
            height: #corps_centre;
            width: 26px;
            background-image: url("../../images/corps_gauche.png");
    }

    #corps_droite {
            position: absolute;
            right: 4%;
            height: #corps_centre;
            width: 27px;
            background-image: url("../../images/corps_droite.png");
    }

    #corps_centre {
            margin-left: 26px;
            margin-right: 27px;
            padding: 10px;
    }


    Voici la page : http://dark-eyed-dreams.com/Nuty%20Services/accueil.html#
    Comme vous pouvez le voir (Sous FFX...pour l'instant) les deux divs de gauche et droite ne comprennent pas de textes et alors ils ne contiennent rien ! Mais j'aimerai qu'ils soient égaux au div du centre pour qu'on voit leur background !! Mais rien à faire, je n'y arrive pas !

    SVP, une solution ! Merci par avance ! ;)
    Très cordialement, Baba0076.
    • Partager sur Facebook
    • Partager sur Twitter
      17 juin 2006 à 18:26:52

      Hello !

      Va voir ce tuto de Finality, il répondra sûrement à ton problème... ;)

      Bonne soirée !
      • Partager sur Facebook
      • Partager sur Twitter
        17 juin 2006 à 18:29:15

        Non, ça ne va pas car c'est extensible pour moi...

        :'(:'(:'(:'(:'(
        • Partager sur Facebook
        • Partager sur Twitter
          17 juin 2006 à 18:42:11

          Rebonjour !

          Je viens d'aller faire un tour chez Alsa (pas les gâteaux, la communauté ! :D ), est-ce que ceci correspond à tes désirs ? :o
          • Partager sur Facebook
          • Partager sur Twitter
            17 juin 2006 à 18:43:18

            Déjà essayé ! :p
            D'ailleur le code que j'ai est le même ! Mais moi dans mes div de gauche et de droite j'ai rien donc ça va pas, enfin c'est bizarre !

            Edition : Je confirme que ça ne va pas pour mon cas...
            • Partager sur Facebook
            • Partager sur Twitter
              17 juin 2006 à 18:53:31

              A oui, excuse-moi, j'avais même pas regardé ton CSS ! :p

              Revois complètement ton code ! ;)

              Déjà, height: #corps_centre; o_O

              Ensuite, reprend exactement le CSS de la page d'Alsa, ça devrait fonctionner... ;)
              • Partager sur Facebook
              • Partager sur Twitter
                17 juin 2006 à 18:55:50

                Mais non, mes coins sont arrondis ! C'est impossible, car chez eux c'est un background color !
                • Partager sur Facebook
                • Partager sur Twitter
                  17 juin 2006 à 18:57:38

                  A ouais, ok, c'est chaud alors...

                  Et quand tu remplis tes div sur les côtés, ça donne ?
                  • Partager sur Facebook
                  • Partager sur Twitter
                    17 juin 2006 à 19:48:52

                    Bah, ça donne que ça va puisque je les veux vides ! On dirai que mon prtoblème AUCUNE PERSONNE ne l'a jamais résolu...

                    Snif !
                    • Partager sur Facebook
                    • Partager sur Twitter
                      17 juin 2006 à 20:00:03

                      Je comprends pas l'utilité de ces div... :o
                      • Partager sur Facebook
                      • Partager sur Twitter
                        17 juin 2006 à 20:01:25

                        A afficher les ombres...
                        • Partager sur Facebook
                        • Partager sur Twitter
                          17 juin 2006 à 20:10:36


                          <div id="corps">
                                  <div id="corps_gauche"></div>
                                  <div id="corps_droite"></div>
                                  <div id="corps_centre">
                                          <p>
                                                  Lorem ipsum dolor sit amet consectetuer ipsum vestibulum In ac Ut. Egestas massa quis massa Quisque nulla eget ut sit leo hendrerit. Semper Duis Maecenas nunc sed ac Curabitur venenatis felis massa metus. Id lobortis convallis pede Vestibulum sem nascetur laoreet eu magna pretium. Ipsum felis Ut dolor magna Vestibulum felis.
                                                  <br /><br />
                                                  In orci leo tortor ac In dolor justo accumsan id condimentum. Facilisi leo porttitor sollicitudin Maecenas at nec Nullam Nam Curabitur nibh. Pellentesque Aenean Curabitur rutrum nibh nulla Quisque feugiat hendrerit wisi elit. Consequat at Vestibulum ante quis sit tortor neque congue non auctor. Sed id eget sed Nam pede purus ac justo in Duis. Fringilla Curabitur enim mus ligula orci at ipsum vitae.
                                                  <br /><br />
                                                  Enim adipiscing urna eget a sit Cras Vestibulum magna et adipiscing. Interdum mi libero pellentesque eget Nam Curabitur magnis enim laoreet ut. Et nec et sed ac mattis Integer laoreet id adipiscing fringilla. Eget ut pede consequat quis justo sem sit neque nulla ante. Mauris accumsan tempus Nulla Nulla Aliquam in nibh.
                                                  <br /><br />
                                                  Augue condimentum semper Curabitur lobortis tincidunt Nunc Curabitur convallis pretium tortor. Tempor Curabitur montes lobortis est Aliquam nec odio Phasellus ante Sed. Habitasse accumsan In eu aliquam dui id Vestibulum et ipsum tristique. Orci sodales Nam elit enim ultrices justo vitae pretium cursus felis. Sagittis habitant Ut Cras sagittis dictumst Curabitur ipsum pretium Lorem hac. Consequat.
                                                  <br /><br />
                                                  Lorem ipsum dolor sit amet consectetuer ipsum vestibulum In ac Ut. Egestas massa quis massa Quisque nulla eget ut sit leo hendrerit. Semper Duis Maecenas nunc sed ac Curabitur venenatis felis massa metus. Id lobortis convallis pede Vestibulum sem nascetur laoreet eu magna pretium. Ipsum felis Ut dolor magna Vestibulum felis.
                                                  <br /><br />
                                                  In orci leo tortor ac In dolor justo accumsan id condimentum. Facilisi leo porttitor sollicitudin Maecenas at nec Nullam Nam Curabitur nibh. Pellentesque Aenean Curabitur rutrum nibh nulla Quisque feugiat hendrerit wisi elit. Consequat at Vestibulum ante quis sit tortor neque congue non auctor. Sed id eget sed Nam pede purus ac justo in Duis. Fringilla Curabitur enim mus ligula orci at ipsum vitae.
                                                  <br /><br />
                                                  Et voici la belle page avec plein de Lorem qui se termine ! Eh oui déjà !<br />
                                                  Mais bon, on s’en tape c’est juste pour faire joli ! ^^
                                          </p>
                                  </div>
                          </div>



                          #corps {
                                  position: absolute;
                                  width: 92%;
                                  margin: auto;
                                  color: #404040;
                                  background-color: white;
                          }

                          #corps_gauche {
                                  position: absolute;
                                  left: 4%;
                                  width: 26px;
                                  background-image: url("../../images/corps_gauche.png");
                          }

                          #corps_droite {
                                  position: absolute;
                                  right: 4%;
                                  width: 27px;
                                  background-image: url("../../images/corps_droite.png");
                          }

                          #corps_centre {
                                  margin-left: 26px;
                                  margin-right: 27px;
                                  padding: 10px;
                          }


                          Que donne ce code ?
                          • Partager sur Facebook
                          • Partager sur Twitter
                            17 juin 2006 à 20:19:09

                            J'avais oublié le tuto un design EXTENSIBLE sans TABLEAUX avec des DIV !
                            Et voici : http://dark-eyed-dreams.com/Nuty%20Services/accueil.html !

                            Encore un chtit bug... ^^

                            Il va vite dégager !
                            D'ailleurs, ça y est ! ^^

                            Bon, bah en plus, l'affichage est nickel sous tous les navigateurs ! =)
                            Valide xHTML 1.0 Strict et CSS 2.0 ! =D

                            Ca gère !
                            Merci encore !

                            @+
                            • Partager sur Facebook
                            • Partager sur Twitter
                              17 juin 2006 à 20:26:05

                              Essaie tout d'abord de bien refermer tes div !

                              Referme #corps_gauche et #corps_droite avant le #corps_contenu.

                              Ensuite, joue au niveau des pourcentages des width ! ;)
                              • Partager sur Facebook
                              • Partager sur Twitter

                              [xHTML] Ces <div>'s : Stop, je pète un câble !!!!

                              × 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