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 :

[Css] Probleme de background sous ie


Sujet :

CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Homme Profil pro
    Administrateur systèmes et réseaux
    Inscrit en
    Juin 2005
    Messages
    74
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Administrateur systèmes et réseaux

    Informations forums :
    Inscription : Juin 2005
    Messages : 74
    Par défaut [Css] Probleme de background sous ie
    Bonjour,

    J'ai un petit soucis, j'ai mis un backgroud de ce type :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    /* titre de l'article */
    h2.pen { 
    	background: url('images/titre.gif') no-repeat;
    	margin-bottom: 1px;	
    	padding: 6px 2px 2px 19px;
    	font-size: 19px;
    	text-align: left;
    	}
    Or, si cela fonctionne à merveille sous firefox, cela ne fonctionne pas du tout sous internet explorer.
    Le site est visible ici : http://your-world-is.mine.nu

    Comment obtenir le même résultat sous Internet Explorer et sous Firefox ?
    merci d'avance

  2. #2
    Membre confirmé
    Inscrit en
    Juin 2004
    Messages
    116
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 116
    Par défaut
    essaye plutot

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    background-repeat: no-repeat;

  3. #3
    Membre confirmé
    Homme Profil pro
    Administrateur systèmes et réseaux
    Inscrit en
    Juin 2005
    Messages
    74
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Administrateur systèmes et réseaux

    Informations forums :
    Inscription : Juin 2005
    Messages : 74
    Par défaut
    Heu le probleme, c'est que si je fais cela, l'image n'est plus affichée ni sous ie ni sous ff

  4. #4
    Membre éclairé Avatar de Davboc
    Profil pro
    Inscrit en
    Novembre 2005
    Messages
    266
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations forums :
    Inscription : Novembre 2005
    Messages : 266
    Par défaut
    tu as bien séparé ?
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    background-image:url('images/titre.gif');
    background-repeat:no-repeat;

  5. #5
    Membre confirmé
    Homme Profil pro
    Administrateur systèmes et réseaux
    Inscrit en
    Juin 2005
    Messages
    74
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Administrateur systèmes et réseaux

    Informations forums :
    Inscription : Juin 2005
    Messages : 74
    Par défaut
    j'avais oublié un point-virgule...

    Bon, changement effectué :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    /* titre de l'article */
    h2.pen { 
    	background-image: url('images/titre.gif');
    	background-repeat: no-repeat;
    	margin-bottom: 1px;	
    	padding: 6px 2px 2px 19px;
    	font-size: 19px;
    	text-align: left;
    	}
    Et toujours cette différence entre ff et ie...ie n'affiche pas l'image

  6. #6
    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
    En fait ton problème ne vient pas de l'insertion d'un background, mais de toute une partie du css qui est carrément ignorée par IE. En cherchant à isoler l'endroit qui fesait bugué le css j'ai relevé ce passage:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    #navcontainer ul li strong a {
    	color: #CF7600; /*beige foncé */
    	border: 1px solid #CF7600; /*beige foncé */
    	}
    Dans un premier temps j'ai pensé que peut-être les é posaient problème. En effet, après les avoir viré tout fonctionnait correctement. J'ai alors observé que ton source déclarait utf-8 comme charset. Après une petite recherche sur Google, on trouve qu'on peut spécifier un charset pour la feuille de style: doc w3c. Il te suffit donc de spécifier ceci tout en haut dans ton css:
    Je suppose que ton css a du prendre utf-8 par défaut et que l'accent pose problème à cet endroit (mais je me demande bien pourquoi ici et pas ailleurs ?! ).
    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

  7. #7
    Rédacteur
    Avatar de marcha
    Homme Profil pro
    Développeur Web
    Inscrit en
    Décembre 2003
    Messages
    1 571
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : Suisse

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Décembre 2003
    Messages : 1 571
    Par défaut
    Salut,

    Comme l'a dit Candygirl, il y a un problème avec les "é", et j'ai investigué quelque
    peu pour essayer de comprendre la cause profonde :-)

    En fait, la source du problème vient du fait que ta feuille de style est
    considérée comme un document encodé avec un charset UTF-8,
    ceci parce que ton document html déclare être encodé en UTF-8
    (voir la balise meta)

    Bon. ok. mais quelle est l'incidence réelle :-) Et bien c'est terrrrriblement
    vicieux, et cela nécessite d'abord une petite explication de l'encodage UTF-8

    UTF-8 est un encodage où un caractère peut être représenté par
    1,2,3,4,5,6,7 ou 8 octets ! Contrairement à iso-8859-1 qui utilise
    toujours 1 octet par caractère.

    UTF-8 est complètement compatible avec le code ASC-II (7 bits), c'est
    à dire que tous les code ASC-II purs (codes non accentués de 0 à 127)
    utilisent 1 octet par caractère (7 bits pour être précis). Par contre les
    caractères accentués nécessitent plusieurs octets.

    Sur la page de Wikipedia qui présente l'UTF-8 il y a un tableau,
    Définition du nombre d'octet utilisé http://fr.wikipedia.org/wiki/UTF-8

    Comme tu as sans doute édité ton document sur windows, les "é" que tu
    as introduits on été mémorisés en tant que code hexa 0xE9 soit en binaire 11101001.

    Hors, un code qui commence par trois "1" signifie en UTF-8 le début d'un
    caractère utilisant 3 octets. Cela implique que les deux caractères qui
    suivent ton "é" en font partie. C'est à dire 1) l'espace et 2) l'étoile "*"

    Cela signifie qu'il n'a pas vu la séquence "*/" qui marque la fin de ton
    commentaire et la suite du code css a été considérée comme faisant
    partie du commentaire et a été ignorée.

    On peut s'amuser a simplement ajouter un espace supplémentaire avant
    le code "*" pour que le navigateur détecte à nouveau la fin de commentaire
    "*/" et tout marche à merveille

    Mais la solution de Candygirl est bien meilleure. Par contre j'attire ton
    attention qu'il est écrit dans ce document que les en-têtes http on
    priorité sur la définition du charset dans la feuille de style !

    Sinon, en regardant ton code html, je ne crois pas que tu aie volontairement
    utilisé l'UTF-8 ? donc une autre solution à ton problème c'est juste de
    modifier le charset avec un "iso-8859-1"

    Ouch... j'espère que j'ai été compréhensible :-)

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

Discussions similaires

  1. probleme de background sous mozilla et pas sous IE
    Par scorpion.os dans le forum Balisage (X)HTML et validation W3C
    Réponses: 9
    Dernier message: 12/04/2007, 11h55
  2. [CSS] probleme de Background
    Par Halukard dans le forum Mise en page CSS
    Réponses: 11
    Dernier message: 04/01/2007, 21h55
  3. [CSS] Problèmes de blocs sous IE
    Par rockingstone dans le forum Mise en page CSS
    Réponses: 7
    Dernier message: 12/05/2006, 20h04
  4. [css] Probleme avec background repeat
    Par meda dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 10/01/2006, 09h38
  5. [CSS] Probleme de background 3 images
    Par nocy dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 08/01/2006, 17h12

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