IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

probleme css avec Ie6 (design centré)


Sujet :

CSS

  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    119
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2005
    Messages : 119
    Par défaut probleme css avec Ie6 (design centré)
    Bonsoir le forum,

    je m'amuse avec le script categorizator , en essayant de refaire son design... j'ai ajouté deux hacks pour centrer le design de cet annuaire.. sous Firefox, c'est bien, mais sous Ie6....c'est une autre histoire...

    http://blogannuaire.webdezero.com


    htlm {text-align="center";
    background-image:url(img/bck.gif];
    background-repeat: repeat;
    }

    body {margin-left:auto;
    margin-right:auto;
    width:490px;
    background-color:#6e8e8;
    border: thin solid #cc0000;
    comment adapter ce centrage pour ie6?

    cdlt,

  2. #2
    Rédacteur
    Avatar de MasterOfChakhaL
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2004
    Messages
    2 147
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Juin 2004
    Messages : 2 147
    Par défaut
    salut,

    tu t'es un peu emmélé les pinceaux...

    htlm => html
    text-align = "center"; => text-align: center;

    si ainsi, ca ne marche pas sous IE6, alors fait comme dans la FAQ, passe par un élément conteneur dans ton body
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    N'oubliez pas de cliquer sur quand votre question à trouvé une solution.

    Si vous n'avez pas encore lu les règles du club, mieux vaut tard que jamais!

  3. #3
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    119
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2005
    Messages : 119
    Par défaut
    j'ai vite tapé le code qui fonctionne pas ...d'ou quelques erreurs de syntaxe..

  4. #4
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    Tu ne peux pas mettre un magin right et left sur le body ..
    Tu dois créer un conteneur sous le body qui prendra toutes ces propriétés.

  5. #5
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    119
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2005
    Messages : 119
    Par défaut
    Re,

    Merci pour vos conseils , ça fonctionner, sauf que je n'arrive pas à afficher mon background-image repeat pour la ligne oblique que je veux faire apparaitre autour du container....

    soit les lignes obliques s'affichent sur toute la page et sur le conteneur, soit il n'y a rien ..comment encadrer le conteneur du motif désirer avec un backround-image+ repeat?

    cdlt

  6. #6
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    Ben mets une couleur de fond à ton conteneur.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    body{
       text-align:center;
       background-image:url(img/bck.gif);
       background-repeat: repeat;
    }
     
    #conteneur{
       margin-left:auto;
       margin-right:auto;
       width:490px;
       background-color:#6e8e8;
       border: thin solid #cc0000;
    }

  7. #7
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    119
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2005
    Messages : 119
    Par défaut
    ok c'est bon pour aujourd'hui, çà marche!..... merci à tous!

  8. #8
    Membre Expert
    Avatar de Candygirl
    Femme Profil pro
    Inscrit en
    Juillet 2006
    Messages
    1 912
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 53
    Localisation : Suisse

    Informations forums :
    Inscription : Juillet 2006
    Messages : 1 912
    Par défaut
    Juste une petite précision, même si le sujet est résolu.

    IE6 centre correctement le margin-left et margin-right en auto pour autant qu'il soit en mode standard, soit qu'il ait un doctype correcte spécifié en haut du document (ce n'est pas le cas de ta page qui n'en contient aucun). Par contre, pour les versions plus anciennes d'IE, qui n'interprètent pas le doctype et restent donc en mode quirks, le passage par le text-align:center sur le body est obligé.

    On peut vraisemblablement donner un width et des marges au body (d'ailleurs par défaut les navigateurs lui attribuent bien des marges et pas un padding sauf les anciennes versions d'opera il me semble) par contre je ne le ferais pas personnellement pour au moins 3 raisons:

    - Cela induit un comportement illogique de la propriété background. En effet, cette dernière s'appliquera à toute la surface quelque soit la taille donnée au body. De même je préfère attribuer un padding au body plutôt qu'un margin pour les mêmes raisons.
    - cela peut poser des problème de scroll-bare horizontale mal positionnée sur la fonction zoom d'IE7
    - Cela risque de ne pas être interprété sur certains navigateurs (en tous cas les plus anciens).

    Par contre dreamweaver, par exemple, avertit que la valeur auto pour les marges n'est pas standard sur le body. Si quelqu'un à une information sur les sources de cet avertissement (réminiscence des attributs de marge sur la balise body ou alors réelle spécification du w3c ? en tous cas ça passe à la validation...) ?
    Les bons réflexes:
    • avant de poser une question:
      règles | faq | tutoriels | recherche
    • clarté, politesse, vocabulaire et orthographe soignés = efficacité
    • remercier ceux qui ont pris le temps d'aider et :resolu: si c'est le cas

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. probleme menu deroulant css avec ie6
    Par rerebubu dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 14/10/2009, 11h59
  2. probleme css avec page utlisant les includes php
    Par gaou2 dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 24/06/2007, 08h54
  3. [AJAX] ajax avec ie6 & 7
    Par markcoxx dans le forum Général JavaScript
    Réponses: 10
    Dernier message: 20/04/2007, 12h46
  4. probleme css avec asp.net
    Par toddy_101 dans le forum Mise en page CSS
    Réponses: 1
    Dernier message: 28/03/2006, 11h37

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo