Partage
  • Partager sur Facebook
  • Partager sur Twitter

besoin d'aide design extensible

explorer vs firefox :s

Sujet résolu
    20 mai 2006 à 15:31:26

    Bonjour a tous j ai besoin de votre aide pour rendre mon design extensible sous firefox car sous explorer ca fonctionne bien
    bon je suis pas un pro en positionnement css c'est surtout du bidouillage c'est pour ca que j ai besoin de vous ^^
    voila l adresse pour que vou voyiez le bad sous mozilla
    http://ragnarok05.free.fr/mangigaflash_online/
    voila a quoi resemble mes bloc
    1bloc principal qui entoure tout ,un header, un menu juste en dessous ensuite un bloc pour d autre info
    bon maintenant le contenu :-°
    un bloc contenu principal avec a l interieur 4 bloc situé les uns a coté des autres je vous met le code css pour que vous jetiez un coup d'oeil merci d'avance pour ceux qui auront le courage et la bonté de me donner un coup de main ^^

    Image utilisateur





    .site /* design complet*/
    {
    background-image:url('');
    width:942px;
    height:;
    background-color:;
    margin-right:auto;
    margin-left:auto;
    margin-top:4px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:none;
    } 

    .header /* design complet*/
    {
    background-image:url('images/Untisstled-1_03.jpg');
    width:942px;
    height:108px;
    background-color:;
    margin-right:auto;
    margin-left:auto;
    margin-top:px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:none;
    } 


    .menu /* design complet*/
    {
    background-image:url('style/images/');
    width:942px;
    height:24px;
    background-color:;
    margin-right:auto;
    margin-left:auto;
    margin-top:px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:none;
    } 





    .contenu /* design complet*/
    {
    background-image:url('images/Untisstled-1_09.jpg');
    width:942px;

    background-color:;
    margin-right:auto;
    margin-left:auto;
    margin-top:px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:;
    } 


    .footer /* design complet*/
    {
    background-image:url('images/Untisstled-1_10.jpg');
    width:942px;
    height:133px;
    background-color:;
    margin-right:auto;
    margin-left:auto;
    margin-top:px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:none;
    } 


     .menuleft/* design complet*/
    {
    background-image:url('mangiga/');
    width:240px;

    background-color:;
    float:left;
    margin-left:px;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:px outset white;
    } 
     
     .menuleft3/* design complet*/
    {
    background-image:url('mangiga/');
    width:170px;

    background-color:;
    float:left;
    margin-left:px;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:0px outset white;
    } 
     .menuright/* design complet*/
    {
    background-image:url('mangiga/');
    width:130px;

    background-color:;
    float:left;
    margin-left:22px;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:0px outset white;
    } 
     .contenu2/* design complet*/
    {
    background-image:url('mangiga/');
    width:540px;

    background-color:;
    float:left;
    margin-left:10px;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
    text-align:left;
    border:px outset white;
    } 
     





    <div class="site">

           <div class="header">
           </div>

           <div class="menu">
           </div>



           <div class="contenu">

                  <div class ="menuleft">


       
                                             
                         <div class ="menuleft3">
                         </div>

                  </div>

                  <div class="contenu2">
                  </div>

                 </div>
                 <div class ="menuright">


           </div>



           <div class="footer">
           </div>


    • Partager sur Facebook
    • Partager sur Twitter
      20 mai 2006 à 16:22:06

      mets clear:bioth;
      dans le footer
      • Partager sur Facebook
      • Partager sur Twitter
        20 mai 2006 à 16:31:54

        Citation : jp949

        mets clear:bioth;
        dans le footer


        clear:both;
        ;)
        • Partager sur Facebook
        • Partager sur Twitter
          20 mai 2006 à 16:34:48

          oui [ clear:both; ] dans la regle css du footer
          • Partager sur Facebook
          • Partager sur Twitter
            20 mai 2006 à 16:37:10

            genial maintenant le contenu s etend c'est deja pas mal :)
            mais l image qu me sert de contenu ne saffiche plus sous mozilla
            regardez http://ragnarok05.free.fr/mangigaflash_online/
            ps: qu est ce que vous pensez de mon codage :-°
            • Partager sur Facebook
            • Partager sur Twitter
              21 mai 2006 à 11:40:31

              nettoie le code html d'abord la on patauge dans la purée enleve les font le s center etc... qui font qu'on ne voit plus rien et que un design commence d'abord par etre un code html apres on met en forme
              • Partager sur Facebook
              • Partager sur Twitter
                21 mai 2006 à 12:31:41

                euh ... je comprend pas la j ai mis que les div pour la page html et dans le code css j ai mis que les bloc de positionnement ya ni font ni center o_O
                • Partager sur Facebook
                • Partager sur Twitter
                  21 mai 2006 à 13:13:05

                  pour ne prendre que les 1ers lignes de ton code et tout le reste est pareil
                  <strong> - 1</strong> news
                  <br/>



                  <strong> - 17/05/2006</strong><a href="index.php#1"> test </a>
                  <br/>

                  </P></div>
                  <div class="stat3">

                  <div class="stat4">

                  <p>

                   <img src="style/images/a_07.gif"><FONT SIZE="1"FACE="verdana"COLOR="#ff4800" > fichier(s): </FONT >

                   <FONT SIZE="1"FACE="verdana"COLOR="black" >[14]</FONT >

                  <br/>

                  Tu les vois les strong font-size colour ?
                  • Partager sur Facebook
                  • Partager sur Twitter
                    21 mai 2006 à 13:29:12

                    ah daccord , mais ca c'est la mise en page je vais pas virer tout ca, a rien a voir avec le positionement des bloc et le fait qu ils soient extensible , j ai mis au dessus le code html avec les div et le code css je pense que ca suffit c'est ce qui à la base quand le site est vide :euh: a mon avis le probleme se trouve plus dans le code css ^^
                    • Partager sur Facebook
                    • Partager sur Twitter
                      21 mai 2006 à 13:32:50

                      fais une mise en pge sans contenu tu verras c plus facile apres tu ajoutes le contenu.
                      La tu as des <p> des br etc.. qui peuvent creer des marges des padding et on voit rien
                      • Partager sur Facebook
                      • Partager sur Twitter
                        21 mai 2006 à 13:52:43

                        eh bien c'est ce que j ai fais au dessus j ai mis une page sans contenu j ai tout enlevé et j ai laissé que la mise en page c'est a dire les div c'est ca que tu veus nan :o
                        je comprend pas trop la
                        • Partager sur Facebook
                        • Partager sur Twitter
                          22 mai 2006 à 1:57:56

                          personne a une petite idée svp pasque je patoge la :(
                          • Partager sur Facebook
                          • Partager sur Twitter
                            22 mai 2006 à 5:11:59

                            j'avais pas bien regardé ton css.
                            tout le contenu de #contenu est en float autrment dit hors du flux donc il n'etire pas le div id="contenu"
                            a la suite de tes cadres flottants ajoute un
                            <p id="clear"></p> avec propriete css
                            #clear {clear: both;}
                            • Partager sur Facebook
                            • Partager sur Twitter
                              22 mai 2006 à 8:24:33

                              Citation : jp949

                              ajoute un
                              <p id="clear"></p>



                              Oh la jolie balise vide :D

                              A priori en rajoutant

                              overflow:hidden;


                              à .contenu

                              Devrait créer un contexte de formatage et résoudre le problème.
                              • Partager sur Facebook
                              • Partager sur Twitter
                                22 mai 2006 à 12:22:04

                                Citation : clb56


                                A priori en rajoutant


                                overflow:hidden;


                                à .contenu
                                Devrait créer un contexte de formatage et résoudre le problème.




                                merci beaucoup avec overflow:hidden; ca fonctionne maintenant j ai le meme resultat sur firefox et explorer c'est magnifique :magicien: c'est quand meme compliqué d avoir le meme resultat sur les deux vivement la nouvelle version d'explorer ^^

                                Citation : jp949

                                <position valeur="justifie"></position>>ajoute un
                                <p id="clear"></p>


                                oki j y penserai mais j a tellement de balise <p> maintenant lol faudra que je m' y consacrer une demi journée :D
                                merci beaucoup pour votre aide !!!
                                • Partager sur Facebook
                                • Partager sur Twitter

                                besoin d'aide design extensible

                                × 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