[Résolus] 2 petits bugs sous IE7

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [Résolus] 2 petits bugs sous IE7

toum_toum

Vivons masqués

Salut à vous.

Je reviens avec mes 2 petits bugs sous IE7.
J'ai épuré mes pages et donc mes codes, pour simplifier et isoler les problèmes :
Ca devrait être plus simple

1. Ici, ma petite deco (le liseré qui fait toute la largeur) est bien sous Firefox, mais decalée sous IE7 :
http://tinyurl.com/326xsm5

2. Là c'est ma margin haute qui disparaît sous IE7, alors que sous Firefox aucun problème :
http://tinyurl.com/37wxbmn

Voici mes codes intégralement :

------------------------------

1. http://tinyurl.com/326xsm5

CSS :

Code :

@charset "utf-8";
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background-image:url(../images/fond_01.gif);
background-repeat:repeat;
margin: 0; /* pour tenir compte des différentes valeurs par défaut des navigateurs */
padding: 0;
text-align: center; /* ce paramétrage centre le conteneur dans les navigateurs IE 5.x. */
color: #000000;
}
#decoration {
position:absolute;
top:150px;
width:100%;
height:50px;
background-image:url(../images/fond_deco_01.png);
background-repeat: repeat-x;
}

HTML :

Code :

<body>
<div id="decoration"></div>
</body>
</html>

-------------------------

2.
http://tinyurl.com/37wxbmn

CSS :

Code :

@charset "utf-8";
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background-image:url(../images/fond_01.gif);
background-repeat:repeat;
margin: 0; /* tenir compte des différentes valeurs par défaut des navigateurs */
padding: 0;
text-align: center; /* ce paramétrage centre le conteneur dans les navigateurs IE 5.x. */
color: #000000;
}
#decoration {
position:absolute;
top:150px;
width:100%;
height:50px;
background-image:url(../images/fond_deco_01.png);
background-repeat: repeat-x;
}
#conteneur1 {
position:relative;
width: 900px;
background-color:#000;
height: 550px;
margin: 20px auto 20px auto;
text-align: left; /* annule le paramètre text-align: center de body. */
}

HTML :

Code :

<body>
<div id="decoration">
</div>
<div id="conteneur1">
</div>
</body>
</html>

Merci de votre coup de main :jap:

Message édité par toum_toum le 13-07-2010 à 17:28:12

---------------
“Et maintenant, la météo" - Soloviev 2022-2024

Publicité

toum_toum

Vivons masqués

Non ? Personne pour un debut de piste ? Ca doit être 2 trucs tout c... mais...

---------------
“Et maintenant, la météo" - Soloviev 2022-2024

Paulp

~, sweet ~

Pour le premier, tu peux essayer d'ajouter un left:0px; à #decoration
Pour le deuxième, essaye de centrer avec :
left:50%;
margin-left:-450px;

plutôt que margin auto

lasnoufle

La seule et unique!

Wesh

Ho j'me suis fait doubler! Etant loin d'etre un pro de CSS les deux me laissent perplexe et ya surement un truc tout con comme tu dis... En attendant y'a des trucs pour contourner.
Pour le premier, pareil que paulp, un left:0px; résout le truc.
Pour le second, j'ai pas mieux que de passer margin de #conteneur1 à '0 auto 20px' et de rajouter un top:20px;

---------------
C'était vraiment très intéressant.

toum_toum

Vivons masqués

Hello et merci de votre coup de main.

J'ai du nouveau pour le n°2 car il est strictement lié au bug1 (l'élément deco).
Si pas de déco, pas de bug sur les margin pour mon bloc en noir.
Donc bug 2 résolu.

Reste ce foutu petit élement de déco qui ne passe pas bien. Je lis vos réponses

---------------
“Et maintenant, la météo" - Soloviev 2022-2024

toum_toum

Vivons masqués

Yes, merci les gars, ça marche

Je me demande comment je n'y ai pas pensé, mais j'étais obnubilé par vouloir "corriger une erreur" qq part, que je n'ai pas pensé à contourner...

Merci :jap:

---------------
“Et maintenant, la météo" - Soloviev 2022-2024

toum_toum

Vivons masqués

Alors par contre du coup évidemment, mon bug2 reste présent (lié à qq chose qui ne lui plait pas dans mon "decoration" )

Une remarque : mon margin disparait en haut, mais aussi en bas.
Je vais tenter vos solutions, notamment celle de lasnoufle dans un premier temps...

Edit : ceci dit je pense que le probleme vient de ça (si jamais ca peut vous éclairer sur le pb) :

#conteneur1 {
position:relative; <- obligé de créé ce positionnement qu'au départ je n'avais pas, à cause de la présence de :

#decoration {
position:absolute; <- ...

Edit2 : bon et bien ça roule.
J'ai pris la solution de lasnoufle et j'ai aussi ajouté un bottom : 20px;
(+ le #conteneur1 à '0 auto 0 auto' )

Edit 3 : Ah, ai parlé un peu trop vite, mon "bottom : 20px;" ne donne pas l'effet voulu (pas de "decollage" du bas de 20 px)

Edit 4 : j'ai remplacé le "bottom" par un "padding-bottom: 20px ;" et cette fois-ci, ca marche (IE et FF)

Merci à vous deux

Message édité par toum_toum le 13-07-2010 à 17:27:53

---------------
“Et maintenant, la météo" - Soloviev 2022-2024

FORUM HardWare.fr

Programmation

HTML/CSS

[Résolus] 2 petits bugs sous IE7

Sujets relatifs
[Résolu] Questions Menu déroulant /opacité/IE7	[resolu]compatibilité ie6 ie7 mais bug anim flash
chevauchement sous ie7 bon sur ie8 et ff	bugs sur ftp filezilla
Créer une div en absolu ? Ca craint sous IE7	[résolu] Probleme alignement menu sous Firefox
Centrer un HTA sous Vista / IE7	pb affichage ie7
Pb de positionnement de div avec IE6-IE7	Documentation Bugs Applicatif
Plus de sujets relatifs à : [Résolus] 2 petits bugs sous IE7

Page générée en 0.061 secondes