Probleme margin padding dans une liste pour un menu avec puce

  • Auteur de la discussion Auteur de la discussion Skycer666
  • Date de début Date de début
WRInaute discret
Bonjour tout le monde, je rencontre un probleme avec les puces dans mon menu

Voici l'url du site : http://ecrivain.on-web.fr/

Avec Firefox, aucun soucis, tout se passe bien.
Malheureusement ac IE sa pose soucis ^^ :)

Voici mon css :

Code:
.page_item a:hover
{
	color:#F98D02;
	_background:url(images/puce2.gif) no-repeat 0 0.28em;
	_margin-left:-10px;
	_padding-left:10px;
}

.page_item:hover
{
	background:url(images/puce2.gif) no-repeat 0 1.10em;
}

Si je change le margin-left en -11px la puce est pratiquement en place mais il y a un pixel de trop sur la gauche.
Par contre si je laisse -10px qui semblerait etre la bonne solution, tout pete et la puce passe sur le texte ?

Si je met le padding a 9px, alors la puce est bien aligné comme sous firefox sauf que la mon texte se decale de 1px !! grrr

Il est possible d'avoir un padding et un margin égal ??

Je comprends pas trop

Merci d'avance

FF
 
WRInaute discret
Perso je vois pas où se situent les puces posant problème, je vois pas de différence entre IE ou firefox ???
 
WRInaute discret
Oups pardon j'ai oublié bien sur de préciser que je travaillais sous IE 6 et le probleme est présent quand on passe la souris dessus -->hover....
 
WRInaute discret
Même au niveau de entreprises et collectivité locale ?
Et y'a pas non plus un léger d'écalage d'un pixel quand tu passe ta souris dessus...
 
WRInaute discret
Justement c'est pas normal que sous IE ça se décalle, c'est pour le moment le seul moyen que j'ai trouvé pour ça soit correcte, mais si tu regarde sous firefox, quand tu passe la souris sur les liens ça ne bouge...
Et c'est la mon probleme.. si je remet padding-left a 10px (sur le site en ligne padding-left : 9px) ça sera trop moche..
pourquoi tout pete quand je change la valeur d'un px
 
WRInaute discret
Non ce que je veux dire c que avant que l'on passe la souris, les menus "particuliers" et "entreprises ..." sont légèrement décalés par rapport aux autres menus mais c plutot bien vu que ce sont des sous menus de Prestations.

Par contre quand je passe la souris sur les menus, la puce ne bouge pas, elle change simplement de couleur, pas de problème donc chez moi sous IE8 (sous google chrome ça fonctionne aussi pour info)
 
WRInaute discret
Ah oui ce décalage la est normal, merci pour la précision.
Déja c'est un bon point si ça fonctionne sous Chrome, IE8 , Firefox --> manque plus que ce fameux IE6 et p-e IE7.. grrr

Si qqn a deja rencontré ce probleme merci de me dire si vous avez reussi a le résoudre et comment.
(PS : sous IE 6 , la puce du hover de Entreprise et Collectivité n'apparait même pas --> probleme sur 2 lignes p-e ?? )
 
WRInaute passionné
Bonjour,

tu risques de ne pas avoir beaucoup de choix autre que de créer un CSS spécifique IE6, avec une rédéfinition des éléments qui posent problèmes. Ensuite, tu dois vérifier le navigateur qui arrive et charger ou non, le correctif IE6. Pour cela, il existe des balises à placer dans la section HEAD d'une page HTML qui sont du style <!--if IE6... il faut chercher dans le forum, il y a déjà des sujets qui traitent de cela. ;-)
 
WRInaute discret
Mais je le fais deja ça de faire juste pour IE6 en faisant un hack devant chaque propriété juste pour IE 6 !!

Deja est-ce que s'est possible d'avoir ainsi

Code:
paddin-left:10px;
margin-left:-10px;
 
WRInaute discret
salut tout le monde , personne ne veut aller voir mon petit probleme.

Mon probleme se situe avec le "li" de la ligne Entreprises et COllectivité locale --> seule "li" sur 2ligne, kan on pass la souris dessus ac IE6 , il n'y pa de puce qui apparait contrairemen au autre "li" ... Please help me !
 
Discussions similaires
Haut