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 :

[Div] Différence d'interprétation FireFox/IE


Sujet :

CSS

  1. #1
    Membre éclairé Avatar de hedgehog
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    295
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 295
    Par défaut [Div] Différence d'interprétation FireFox/IE
    Bonjour tout le monde,

    J'aurais encore une fois besoin de vos lumiéres concernant une disposition en <div>.

    Sous FireFox, tout se passe bien, le probléme vient de IE : une répétition d'une image en background fait son apparition dans un <div> (#accueil_1) alors qu'il n'y a pas lieu d'être.

    Voici 3 images qui vous expliqueront mieux le probléme :

    Sous FireFox ( ce que je veux ):




    Sous IE ( qui pose probléme ):




    Plan des blocks :


    Voici la partie du code CSS concernée :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    #conteneur {
    	width:820px;
    	height:712px;
    	margin-left:auto;
    	margin-right:auto;
    }
     
    #banniere {
    	background-image:url(images/banniere.jpg);
    	width:820px;
    	height:159px;
    	float:none;
    }
     
    #accueil_laterale_gauche_haut {
    	background-image:url(images/accueil_laterale_gauche_haut.jpg);
    	width:10px;
    	height:43px;
    	float:left;
    }
     
    #block_menu {
    	width:800px;
    	height:43px;
    	float:left;
    }
     
    #accueil_1 {
    	background-image:url(images/accueil_1.jpg);
    	width:800px;
    	height:8px;
    	float:none;
    }
     
    #accueil_menu {
    	background-image:url(images/accueil_menu.jpg);
    	width:800px;
    	height:35px;
    	float:none;
    }
     
    #accueil_laterale_droite_haut {
    	background-image:url(images/accueil_laterale_droite_haut.jpg);
    	width:10px;
    	height:43px;
    	float:left;
    }
    Auriez-vous une idée de ou vient le probléme ?

    Merci d'avance.

  2. #2
    Membre confirmé
    Profil pro
    Inscrit en
    Octobre 2007
    Messages
    50
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations forums :
    Inscription : Octobre 2007
    Messages : 50
    Par défaut
    Je ne vois pas bien le problème sur les images mais si c'est juste un repeat de l'image de fond, il suffit dans le css d'indiquer no-repeat;

    CSS:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    #accueil_menu {
    	background-image:url(images/accueil_menu.jpg) no-repeat;
    	width:800px;
    	height:35px;
    	float:none;
    }

  3. #3
    Membre éclairé Avatar de hedgehog
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    295
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 295
    Par défaut
    J'ai essayé un no-repeat mais ca ne régle pas le probléme.

    j'ai reposté deux images ciblants mieux le probléme.

  4. #4
    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
    Citation Envoyé par hedgehog Voir le message
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    #accueil_1 {
    	height:8px;
    }
    IE n'accepte pas de donner une hauteur inférieure au line-height à un div. 2 idées pour le forcer à prendre en compte ton height:

    • lui donner un font-size de 0
    • lui attribuer un overflow:hidden
    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

  5. #5
    Membre éclairé Avatar de hedgehog
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    295
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 295
    Par défaut
    Merci de vos réponses

    Merci CandyGirl, tu me retires une sacrée épine du pied

    Résolu

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

Discussions similaires

  1. Différence interprétation firefox mac/pc.
    Par castelcerf dans le forum Langage
    Réponses: 1
    Dernier message: 11/11/2009, 22h11
  2. IE et Firefox : différences d'interprétation de Javascript
    Par skythe dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 05/01/2009, 12h40
  3. [W3C] IE/firefox: différence d'interprétation
    Par Braillane dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 11/05/2007, 19h31
  4. [SQL-Server] Différence d'interprétation de date en PHP par rapport à ASP sur SQLServer
    Par berceker united dans le forum PHP & Base de données
    Réponses: 1
    Dernier message: 08/06/2006, 16h28
  5. Différence IE et Firefox
    Par Jibees dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 07/04/2006, 10h57

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