[CSS] Probleme avec IE6

**m312** · 11/08/2005, 22h18

En faisant une bete page de type:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<html>
 
<head>
<link rel="stylesheet" href="style.css" />
</head>
 
<body>
<div id='1'></div>
<div id='2'></div>
</body>
 
</html>

avec un CSS encore plus bete :

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
 
div#1 {
width: 125px;
height: 250px;
background-color:red;
float: left;
margin: 0
}
 
div#2 {
width: 125px;
height: 250px;
background-color:blue;
margin: 0
}

(width et height choisis au hasard), on obtient une marge entre les deux conteneurs (1 et 2), cela uniquement sous IE (6 pour moi, mais c'est certainement pareil pour ses grands freres).
Par contre sous Opera il n'y a aucune erreur (les deux divs sont bien collés l'un a l'autre).

Y'a-t-il un moyen de faire que cette marge (inexistante en fait) disparraisse ? (tant sous IE que sous Opera ou tout autre explorateur).

Merci d'avance
m312

**Nesmontou** · 11/08/2005, 22h43

Peut-être en faisant

Code :

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

margin: 0;

A tester

**m312** · 12/08/2005, 12h01

Excuser l'erreur, mais justement le probleme intervient (ou reste comme vous voulez) meme avec "margin: 0" sous IE 6 hehe

Je change ca tout de suite

**v4np13** · 12/08/2005, 12h10

Ton float left, ne sert à rien, c'est par défaut mis à gauche.

Mets float:right; à l'autre. et éventuellement une marge gauche de la taille de div1

**glloq8** · 12/08/2005, 12h11

Ca aurait pût être sympa en disant bonjour !!

**m312** · 12/08/2005, 12h18

Envoyé par v4np13

Ton float left, ne sert à rien, c'est par défaut mis à gauche.

Mets float:right; à l'autre. et éventuellement une marge gauche de la taille de div1

Il me semble que sinon les divs sont mis l'un en dessous de l'autre, non ?

J'ai pas calé le truc du "mettre un float: right", dans ce cas les deux divs sont plus alignés correctement ? (le 1 a droite et le 2 a gauche) ?

Envoyé par glloq8

Ca aurait pût être sympa en disant bonjour !!

Hehe, excusez aussi le bonjour, mais c'est hier soir que je l'ai ecrit, et ca faisait deja deux bonnes heures que je cherchais pourquoi IE fait ca

Donc bonjour quand meme

**v4np13** · 12/08/2005, 12h21

J'ai pas compris alors.... Le résultat que tu veux c'est quoi? Un en dessous de l'autre? ou un à coté de l'autre?

Si c'est un en dessous de l'autre, tu utilise deux fois le même div (en utilisant une class)

**m312** · 12/08/2005, 12h49

non je veux l'un a coté de l'autre, genre:

Code :

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

1
2
3
4
5
 
+------+-----+
| div  | div |
|rouge | bleu|
+------+-----+

or sous IE on obtient:

Code :

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

1
2
3
4
5
 
+------+ +-----+
| div  | | div |
|rouge | | bleu|
+------+ +-----+

et c'est cette marge (qui meme en la mettant a zero reste) qui m'embete

**v4np13** · 12/08/2005, 12h53

Et si tu essayes ceci?

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
div#1 {
width: 125px;
height: 250px;
background-color:red;
margin: 0
}
 
div#2 {
width: 125px;
height: 250px;
background-color:blue;
margin-left:125px;
}

En rajoutant p-e les paramètres de position: absolute ou relative.

**m312** · 12/08/2005, 12h57

Envoyé par v4np13

Et si tu essayes ceci?

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
div#1 {
width: 125px;
height: 250px;
background-color:red;
margin: 0
}
 
div#2 {
width: 125px;
height: 250px;
background-color:blue;
margin-left:125px;
}

En rajoutant p-e les paramètres de position: absolute ou relative.

Il faut en effet mettre un position...

Il me semblait bien que decaler le div#2 vers la gauche de 3px (la taille de l'espace inexistant que laisse IE6) etait la seule solution qui marche partout (sans toute fois etre optimale pour ce que je veux, mais bon, tout n'est pas parfait).
Une solution a ce probleme peut donc etre:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
div#1 {
width: 125px;
height: 250px;
background-color:red;
margin: 0
}
 
div#2 {
position: relative;
width: 125px;
height: 250px;
background-color:blue;
left: -3px
}

J'utiliserai ca, puisque j'en ai marre de chercher tellement pour 3 pixels de *****

hehe

Merci pour votre aide, a bientot j'en suis sur

**m312** · 12/08/2005, 13h09

Manifestement c'est pas entierement resolu, puisque dans mon projet c'est Opera qui comprends plus comme il faut le position: relative apres ...

Mais bon

**ilood** · 12/08/2005, 13h20

Passe par un hack CSS, qui en soit compris que par IE par exemple.

[CSS] Probleme avec IE6

CSS

Discussions similaires

Partager

Partager