CSS difference entre FireFow et IE6
3 messages
• Page 1 sur 1
Consultez la formation à Google Analytics de WebRankInfo / Ranking Metrics
- madx
- WRInaute occasionnel

- Messages: 303
- Inscription: 19 Juin 2003
CSS difference entre FireFow et IE6
Bonjour,
J'ai un problème que j'aimerai resoudre et surtout comprendre, je veux faire un menu avec un rollover, mon pb est que le positionnement des images est différente suivant le navigateur (IE ou firefow), si je centre pour IE en hauteur mes menu pour FireFox j'ai un léger decalage, mon code est :
Le HTML
Pour corriger ce pb je fait ;
J'ai trouvé cette solution mais j'aimerai comprendre pourquoi ce décalage, la plus logique deconne.
Merci de votre aide
J'ai un problème que j'aimerai resoudre et surtout comprendre, je veux faire un menu avec un rollover, mon pb est que le positionnement des images est différente suivant le navigateur (IE ou firefow), si je centre pour IE en hauteur mes menu pour FireFox j'ai un léger decalage, mon code est :
- Code: Tout sélectionner
#menu-fond {
float: left;
width: 146px;
height: 464px;
background-color:#FFFFFF;
background-image: url(images/menu.jpg);
background-repeat: no-repeat;
text-align : left;
}
#menu a {
position: absolute;
width:141px;
height:18px;
text-decoration: none;
background: #FF69B4;
}
#menu a i {
visibility: hidden;
}
a#societe{
top:140px;
}
a#societe:hover{
background: url(images/societe.gif) no-repeat;
}
a#nouveaute{
top:190px;
}
a#nouveaute:hover{
background: url(images/nouveaute.gif) no-repeat;
}
Le HTML
- Code: Tout sélectionner
<div id="menu-fond">
<div id="menu">
<a href="#" id="societe"><i>Societe</i></a>
<a href="#" id="nouveaute"><i>Nouveaute</i></a>
</div>
</div>
Pour corriger ce pb je fait ;
- Code: Tout sélectionner
a#societe{
/* top:140px; */
margin-top:42px;
}
a#nouveaute{
/* top:190px; */
margin-top:92px;
}
J'ai trouvé cette solution mais j'aimerai comprendre pourquoi ce décalage, la plus logique deconne.
Merci de votre aide
- agabtehu
- Nouveau WRInaute

- Messages: 6
- Inscription: 15 Jan 2004
dans l'absolute, abstiens-toi
C'est peut-être la gestion de position:absolute qui est gérée différement par IE (vu qu'il a un moteur plus ancien).
J'ai vérifié sur openWeb : http://openweb.eu.org/articles/initiation_absolue/
Avec position:absolute, #menu n'utilise #menu-fond comme référent que si #menu-fond est déjà en position relative ou absolute. Dans le cas contraire, c'est la fenêtre (viewport) qui est utilisée comme base.
Moi j'aurai viré le position:absolute et gardé un margin-top sur #nouveaute. Et forcé
#menu a {display: block;} pour que le height soit bien en compte.
J'ai vérifié sur openWeb : http://openweb.eu.org/articles/initiation_absolue/
Avec position:absolute, #menu n'utilise #menu-fond comme référent que si #menu-fond est déjà en position relative ou absolute. Dans le cas contraire, c'est la fenêtre (viewport) qui est utilisée comme base.
Moi j'aurai viré le position:absolute et gardé un margin-top sur #nouveaute. Et forcé
#menu a {display: block;} pour que le height soit bien en compte.
3 messages
• Page 1 sur 1
Formation recommandée sur ce thème :
Formation Google Analytics : en 2 jours, apprenez comment exploiter l'essentiel des possibilités de l'outil de mesure d'audience de Google. Formation animée par les experts Google Analytics de Ranking Metrics.
Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.
Lectures recommandées sur ce thème :
- Différence IE6 SP2 et IE6 ?
- IE6 et CSS height
- [CSS] : scroller overflow et ie6 :-(
- [resolu]problème css IE6
- [CSS] Problème avec IE6...
- [résolu] CSS : position fixed et IE6
- [SOLUTION] Differencier IE6 IE7 et FIREFOX en CSS
- Menu CSS qui ne fonctionne pas sous IE6
- Probleme CSS avec IE6 (div coupé par son conteneur)
- [CSS] Différence IE7 / FireFox
Qui est en ligne
Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 2 invités
