Partage
  • Partager sur Facebook
  • Partager sur Twitter

Comment résoudre le problème des marges d'IE ?

Sujet résolu
    31 janvier 2006 à 21:25:28

    Bonsoir.

    J'ai un souci de marge sous IE. Comment résoudre se problème ?

    Merci
    • Partager sur Facebook
    • Partager sur Twitter
      31 janvier 2006 à 21:38:08

      Si tu utilise des float , essaie d'ajouter l'attribut display:inline; a tes div utilisant des float.

      Cepandant essai d'être un pu plus précis
      • Partager sur Facebook
      • Partager sur Twitter
        31 janvier 2006 à 21:56:20

        utilise le css

        margin:0;

        je pense que ca devrait fonctionner.

        mais c vrai que t'as question n'est pas très précise :D
        un lien ?
        • Partager sur Facebook
        • Partager sur Twitter
          31 janvier 2006 à 22:01:57

          J'ai un menu à gauche et un à droite, puis le corps qui flotte entre les deux au milieu .

          Je me retrouve sous IE uniquement avec une marge de 1 pixel à peut près entre le menu gauche et le corps et entre le corps et le menu droit. Je précise j'ai tout le margin et padding à 0
          • Partager sur Facebook
          • Partager sur Twitter
            31 janvier 2006 à 22:24:18

            Salut,

            Comme tu n'en dis pas beaucoup, un bout de code ?

            A tout hasard as tu mis des bordures sur les blocs qui ont ce problèmes ?
            • Partager sur Facebook
            • Partager sur Twitter
              31 janvier 2006 à 22:54:16

              effectivement tu n'en dis pas beaucoup, parceque IE et les bug de marges il y en a un paquet, ...
              1 px a html a gauche (generalement passe inaperçu, marge gauche doublée sur des flottant a gauche, decalage de 3 pixel a droite et sur la hauteur du flottant, etc ....
              plusieurs soluce selon les contextes, comme dis plus haut le display:inline; , le position relative pour replace les element, un "double css" pour les marges dans des commentaires conditionnel ou a l'aide des differents hack, , remplacer les marges externes par des marges internes, etc ... a chaque bug son contexte et a chacun sa methode favorite ... mais jamais avec une boule de cristal :)
              a plus
              • Partager sur Facebook
              • Partager sur Twitter

              fan de pluxml je suis cuisinier et codeur amateur. Des thèmes pour pluxml ? Oui

                1 février 2006 à 7:52:53

                Voir ici, avec le code source dela page
                http://www.meteo-world.com/site2/aa.php

                Le bloc Date ou il y a écrit "vous êtes ici", ne colle pas a gauche, il y a une marge sous IE.
                • Partager sur Facebook
                • Partager sur Twitter
                  1 février 2006 à 8:05:05

                  tu veux qu'il colle a gauche ?

                  #bug {
                  background-color:/*la meme que celle de #date*/;
                  position:relative;
                  left:-6px; }


                  <div id="date"><div id="bug">Vous etes ici</div></div>

                  • Partager sur Facebook
                  • Partager sur Twitter
                    1 février 2006 à 8:21:46

                    Oui je le veut qu'il colle à la ligne qui sépare le menu gauche, du corps.

                    Cependant ta solution marche sous IE, mais maintenant il se trouve que sous Mozzila ou Firefox s'est trop décalé vers la gauche, ca empiète sur le menu gauche
                    • Partager sur Facebook
                    • Partager sur Twitter
                      1 février 2006 à 9:03:10

                      left:0 ! important; /*pourFF et opera et nscape*/
                      left:-6px; /*pour IE */
                      • Partager sur Facebook
                      • Partager sur Twitter
                        1 février 2006 à 13:32:19

                        Marche toujours pas :(
                        http://www.meteo-world.com/site2/aa.php


                        #date
                        {

                           margin: 0px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
                           padding: 0px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
                           text-align: left;
                         background-image: url("999.gif");
                         color: #ffffff;
                        font-family: Geneva, Arial, Helvetica, sans-serif;
                         font-size: 0.7em;
                        height: 15px;
                        left:0 ! important; /*pourFF et opera et nscape*/
                        left:-6px; /*pour IE */
                        }
                        • Partager sur Facebook
                        • Partager sur Twitter
                          1 février 2006 à 13:48:37

                          #date
                          {
                          margin: 0px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
                          padding: 0px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
                          text-align: left;
                          background-image: url("999.gif");
                          color: #ffffff;
                          font-family: Geneva, Arial, Helvetica, sans-serif;
                          font-size: 0.7em;
                          height: 15px;
                          position:relative;
                          left:0 ! important; /*pourFF et opera et nscape*/
                          left:-6px; /*pour IE */
                          }
                          tu n'avais pas remis position:relative
                          • Partager sur Facebook
                          • Partager sur Twitter
                            1 février 2006 à 14:45:11

                            Décidemment lesproblèmes s'enchainent.

                            Ca résoud le problème à gauche, mais sa met la marge à droite maintenant.
                            • Partager sur Facebook
                            • Partager sur Twitter
                              1 février 2006 à 14:52:39

                              essaie de rajouter margin-right:-3px; sinon faudra faire un autre div dans le menu droite pour fermer l'espace
                              • Partager sur Facebook
                              • Partager sur Twitter
                                1 février 2006 à 14:59:40

                                Non ca ne fait rien du tout :(
                                http://www.meteo-world.com/site2/aa.php


                                css:

                                #date
                                {


                                padding: 0px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
                                text-align: left;
                                background-image: url("999.gif");
                                color: #ffffff;
                                font-family: Geneva, Arial, Helvetica, sans-serif;
                                font-size: 0.7em;
                                height: 15px;
                                position:relative;
                                left:0 ! important; /*pourFF et opera et nscape*/
                                left:-4px; /*pour IE */
                                margin-right:-3px

                                }
                                • Partager sur Facebook
                                • Partager sur Twitter
                                  1 février 2006 à 15:54:09

                                  laisse tomber on est mal parti ce matin
                                  vas a cette adresse j'ai tout corrigé fais copier/coller du code source
                                  icila
                                  • Partager sur Facebook
                                  • Partager sur Twitter
                                    1 février 2006 à 18:13:09

                                    bonjour, un petit coup de fatigue jp ? :) , tu lui propose une page en html quand il a al abase voulu une page en xhtml, j'imagine que ce sont les "majuscule" qui t'ont fait basculer sur un autre doctype...

                                    le probleme pouvait-etre resolu de cette façon, avec les commentaires conditionnels juste pour IE.
                                    <!--[if IE]>
                                    <style type="text/css">
                                    #date
                                    {
                                       
                                    position:relative;
                                    left:-3px;
                                    }
                                    #md
                                    {
                                       
                                    position:relative;
                                    left:-8px;
                                    }
                                    </style>
                                    <![endif]--></head>


                                    wydhook, n'hesite pas a te servir des validateurs, pour debusquer tes erreurs de frappes eventuelles, balises non refermées ou structures" html interdites...

                                    essai ces commentaires dans ta page pour voir, cla va te permettre de ne plus toucher au css "commun" et te concentrer sur le petit bout pour IE.
                                    Il faut que tu place ces commentaires conditionnel, entre les balises head, et apres avoir chargé les styles communs .

                                    <edit> en xhtml pas de majuscule pour le css ..... :) </edit>

                                    a plus

                                    • Partager sur Facebook
                                    • Partager sur Twitter

                                    fan de pluxml je suis cuisinier et codeur amateur. Des thèmes pour pluxml ? Oui

                                      1 février 2006 à 20:21:50

                                      jp949 >> ca ne fontionee pas. Retreci l'ecran en mettant la barre des favoris à gauche et tu verra, tout ce décale vers le bas :(


                                      gcyrillus >> la page est bien aux normes w3c, je vient de tester :)
                                      • Partager sur Facebook
                                      • Partager sur Twitter
                                        1 février 2006 à 22:04:22

                                        .... et les attributs css modifiés dans les commentaires conditionnels ...
                                        les commentaires conditionnel sont la methode que je prefere, car, on peut filtrer, les versions d'ie , s'en servir pour cacher des feuilles de style (ou balise ou javascript) ou a l'opposer n'en charger que pour toutes ou une sele version d IE, et de plus on a pas a bidouiller un fichier css compatible avec tout les navigateurs respectueux des normes...

                                        j'ai quelques petit exemples, si tu veux ... comprendre leur utilisation, de plus c'est aussi valide :) . ( l'underscore, le !important et même un "#" (diese) devant un attribut peut servir de hack, mais bon le diese passe dans opera et que vas faire IE7 de tout ça ?.
                                        CSS, JS ou balises supplementaire que pour IE.
                                        1 feuille de style ou quelques style modifiés pour IE seulement.
                                        Commentaires conditionnels pour cacher une partie de la page a IE.
                                        et cacher un fichier css sans commentaires conditionnel.

                                        Perso, quand je reviens sur une page (15 jours suffisent) je suis bien content de retrouvé mes css speciales IE dans un fichier a part.

                                        a plus

                                        A propos:
                                        reglé ou pas réglé ton probleme ?, pour rester dans ton sujet...
                                        • Partager sur Facebook
                                        • Partager sur Twitter

                                        fan de pluxml je suis cuisinier et codeur amateur. Des thèmes pour pluxml ? Oui

                                          1 février 2006 à 22:53:40

                                          Merci à vous tous pour votre aide et vos renseignements supplémentaires. :)
                                          • Partager sur Facebook
                                          • Partager sur Twitter
                                            2 février 2006 à 5:31:54

                                            c'est incomprehensible , je reduis la taille de la fenetre jusqu'a 400px sur IE et avec FF tant que le petit texte vous "etes ici" ne passe pas a la ligne c'est a dire a 150px de large.
                                            Pour le doctype j'avais pas fais gaffe j'ai repris un ancien fichier sans regarder la dtd mais c'est corrigé .
                                            pour le bidouillage le " ! important " n'est pas un bidouillage ni un hack mais une propriété css2 au meme titre que " height ou width "
                                            • Partager sur Facebook
                                            • Partager sur Twitter
                                              2 février 2006 à 10:03:32

                                              Citation : jp949

                                              c'est incomprehensible , je reduis la taille de la fenetre jusqu'a 400px sur IE et avec FF tant que le petit texte vous "etes ici" ne passe pas a la ligne c'est a dire a 150px de large.
                                              Pour le doctype j'avais pas fais gaffe j'ai repris un ancien fichier sans regarder la dtd mais c'est corrigé .
                                              pour le bidouillage le " ! important " n'est pas un bidouillage ni un hack mais une propriété css2 au meme titre que " height ou width "




                                              J'ai bidouiller, et à force je suis arriver à un truc d'assez sympas, grace a ton aide.

                                              Merci encore pour ta disponibilité, sur les divers posts . A+++ ;)
                                              • Partager sur Facebook
                                              • Partager sur Twitter
                                                2 février 2006 à 10:14:53

                                                ac plaisir n'hesite pas
                                                • Partager sur Facebook
                                                • Partager sur Twitter
                                                  2 février 2006 à 10:53:08

                                                  Encore un bug, j'ai beau bidouiller ca ne fonctionne pas.

                                                  Comment on fait pour que le menu gauche et droit colle toujours au footer ?

                                                  Voir lien ici http://www.meteo-world.com/site2/

                                                  les menu gauche et droit ne colle pas au footer

                                                  • Partager sur Facebook
                                                  • Partager sur Twitter
                                                    2 février 2006 à 11:36:54

                                                    c'est le corps qui est plus long que les menus et de plus tu as margin-bottom:20px sur corps
                                                    • Partager sur Facebook
                                                    • Partager sur Twitter
                                                      2 février 2006 à 11:49:20

                                                      http://www.meteo-world.com/site2/

                                                      je vient de résoudre le probleme du margin. Mais je voudrais que meme si le corps et trop long, les marge des menu colle toujours jusqu'en bas sur le footer, ce qui fera moins moche :) le corps de lapage sera plus ou moins long suiviant les news, ca changera tous les jours
                                                      • Partager sur Facebook
                                                      • Partager sur Twitter
                                                        2 février 2006 à 13:46:27

                                                        je vois qu'une solution mettre une image en bg de body qui ait les couleurs de tes 2 menus et repeat-y
                                                        • Partager sur Facebook
                                                        • Partager sur Twitter
                                                          2 février 2006 à 13:57:58

                                                          Oui, je pense aussi ... :(
                                                          • Partager sur Facebook
                                                          • Partager sur Twitter
                                                            2 février 2006 à 14:01:51

                                                            Arfff, j'aurait plus mes marges de séparation.

                                                            Mince. Bon vais bidouiller encore, mais si quelqu'un a une bonne solution qu'il le dise.

                                                            Merci :)
                                                            • Partager sur Facebook
                                                            • Partager sur Twitter
                                                              2 février 2006 à 14:41:29

                                                              je t'ai preparé un truc la-bas vas voir si ca te convient
                                                              http://www.jp949.info/misenpage22.html
                                                              • Partager sur Facebook
                                                              • Partager sur Twitter

                                                              Comment résoudre le problème des marges d'IE ?

                                                              × 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