problème de positionnement css avec IE7

**rasleboldesid** · 31/08/2006, 23h37

La page que je viens d'écire contient des liens qui ne s'affichent pas correctement (ou qui ne réagissent pas du tout) avec IE7 (je n'ai pas testé avec IE6) alors qu'il n'y a aucun problème sous Opéra ou Firefox. Je les ai positionné avec des feuilles de styles (avec des id spécifiques pour chaque liens décrivant leurs tailles et leurs positions). Je me suis tout d'abord dis qu'il devait y avoir des chevauchements entre zones "actives" que IE7 ne gérait pas (

). Mais après vérification ce n'est pas le cas. J'ai pensé avoir ommis des déclarations nécéssaires à cette prise en charge par IE7 (genre padding/margin pour les id ou un truc genre display:block pour les balises <a> etc.), mais là encore, ça n'a rien résolu !!! Je suis vraiment perdu là ! Quelqu'un pourrait-il m'aider ? Merci !!!!!

**MasterOfChakhaL** · 01/09/2006, 12h19

Je pense qu'un petit bout de code serait le bienvenue pour nous permettre de réfléchir...

**rasleboldesid** · 01/09/2006, 13h53

ok :

Exemple de code css :

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
#conseils {
height: 150px;
width: 65px;
top: 140px;
left: 90px;
padding: 0px 0px 0px 0px;
}
 
#conseils:hover{
height: 187px;
width: 83px;
top: 101px;
left: 69px;
background: url(conseils.gif) no-repeat;
padding: 0px 0px 0px 0px;
 
}

Exemple de code html :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<ul>
<li><a id="conseils" title="conseils" accesskey="1" href="conseils.html"></a></li>
</ul>

**MasterOfChakhaL** · 01/09/2006, 14h34

bizarre...

les propriétés width et height s'appliquent aux éléments blocs...
un petit display:block; ...

les propriétés top et left s'appliquent aux éléments positionnés...
un petit position:relative; (ou absolute) ...

je vois qu'au survol, tu déplace, tes liens vers le bas...
est-ce que tes liens restent inactifs si tu les survols en arrivant par le bas

et-ce que l'état hover se déclenche?

**rasleboldesid** · 01/09/2006, 14h46

alors voilà ce que j'ai par ailleurs :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
a{ 
   position:absolute;
   display:block;
}

et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
ul{ 
   position:relative;
   list-style:none;
   padding: 0px;
   margin: 0px;
   width:800px;
   height:600px;
   background: url(pageprincipale.jpg) no-repeat;
}

Sous IE, certains liens sont totalement inactif, d'autres se réduisent quasiment à un simple point !!! Sinon, mais j'interprète peut-être mal ce que tu me dis, j'aurais plutôt dis que mes liens se déplacent vers le haut au survol de la souris (de top:140px; à top:110px; ). L'état hover se déclenche très bien sous opéra et firefox, beaucoup plus difficilement sous IE, voire pas du tout pour certeins...

**MasterOfChakhaL** · 01/09/2006, 14h49

j'essaierais ceci (mais ton histoire me semble bizarre, il doit y avoir des choses qui interfèrent):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
ul { z-index:1; }
a { z-index:2; }

tu peux aussi rajouter ca pour localiser un peu tes éléments

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

* { border: 1px solid red; }

**MasterOfChakhaL** · 01/09/2006, 15h43

oui,

j'ai pas trouvé, mais c'est vrai qu'il y a des trucs que je ne comprends pas...
notamment les lignes des li mais aussi, quand tu fais CTRL+A, c'est bizarre la forme de la sélection

(je n'ai qu'IE6 mais le problème semble identique)

Je suppose que tu as remarqué que le problème se situait au niveau des liens qui sont dans la zone de ces fameuses lignes...

Tu remarqueras aussi que si on commence par un endroit ou le lien marche comme il faut et qu'on fait le tour de la fleur, la plupart des fois, ca fonctionne.

Les bodures te permettent également de voir que, quand un pétale est agrandi, tu n'as plus beaucoup de zone "libre" pour activer les voisins (essentiellement pour les pétales en diagonal)

je fais une petite pause et te laisse mariner un peu et je m'y repencherai plus tard.

PS: l'astuce du border m'a également changé la vie (mais attention, pour un positionnement précis au pixel près, ca peut occasionner des décalages... il faut en avoir consience)

**rasleboldesid** · 01/09/2006, 15h57