Discussion :

[keub51]

Comment empecher IE de doubler les marges ?

[Dan_A]

http://www.positioniseverything.net/...ed-margin.html

[keub51]

si j'ai bien compris il suffirait de rajouté display : inline pour voir les bugs de IE disparaitre ...

Mais bon j'ai beau mettre cette propriété dans mes feuille css rien ne change ...

exemple :
- japplique un padding dans un flotant :
IE ne redimensionne pas le cadre
Firefox redimensionne le cadre
...

voila ma css et mon html :

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
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
body
{
margin:auto;
}
 
#ban
{
width : 100%;
height : 91px;
background-image : url("images/ban.JPG");
background-repeat : no-repeat;
}
#menu
{
clear: both;
background-repeat : no-repeat;
float : left;
width : 150px;
margin-left : 2px;
display: inline;
}  
#up_menu
{
background-image : url("images/menu.jpg");
background-repeat : no-repeat;
width : 148px;
height : 25px;
text-align : center;
font-weight : bold;
font-size : 12px;
padding-top : 3px;
font-family : arial;
}  
#in_menu
{
height : 20px;
width : 95%;
text-align : center;
font-weight : bold;
font-size : 12px;
font-family : arial;
}    
#foot_menu
{
background-image : url("images/menu2.jpg");
background-repeat : no-repeat;
width : 148px;
height : 25px;
text-align : center;
font-weight : bold;
font-size : 12px;
}     
#header {
width:100%;
font-size:10px;
line-height:normal;
margin-left : 150px;
}
#header ul {
margin:0;
padding:10px 10px 0;
list-style:none;
}
#header li {
float:left;
background:url(images/norm_left.gif) no-repeat left top;
margin:0;
padding:0 0 0 9px;
}
#header a {
float:left;
display:block;
background:url(images/norm_right.gif) no-repeat right top;
padding:5px 15px 4px 6px;
text-decoration : none;
color : black;
font-family:"comic sans ms" ;
}
 
    #header a {float:none;}
    /* End IE5-Mac hack */
    #header a:hover {
      color:#333;
      }
    #header #current {
      background-image:url(images/norm_left_on.gif);
      border-width:0;
	  color : black;
      }
    #header #current a {
      background-image:url(images/norm_right_on.gif);
      color:#333;
      padding-bottom:5px;
      }
#corps
{
margin-left : 5px;
float : left;
width : 645px;
border : 1px solid white;
text-align : justify;
margin-bottom : 10px;
border : 1px solid black;
padding : 10px;
display: inline;
}
#pied
{
border : 1px solid black;
height : 10px;
margin-top : 10px;
margin-left : 2px;
float : left;
clear: both;
text-align : center;
width : 800px;
font-size : 10px;
padding-top : 5px;
padding-bottom : 5px;
background-image : url("images/pied.JPG");
}

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
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xhtml="http://www.w3.org/1999/xhtml">
<head>
  <title>Nordtech Grossiste Informatique</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <meta http-equiv="Content-Language" content="fr" />
<link rel="stylesheet" media="screen" type="text/css" title="style_nordtech" href="style.css" />
</head>
 
<body>
<div id="ban">
</div>
<div id="header">
<ul>
  <li id="current"><a href="">Accueil</a></li>
  <li><a href="">Intégration</a></li>
  <li ><a href="">Périphériques</a></li>
  <li><a href="">Connectique</a></li>
  <li><a href="">Multimédia</a></li>
  <li><a href="">Accesoires/Conso</a></li>
  <li><a href="">Réseaux</a></li>
  <li><a href="">Divers</a></li>
</ul>
 
</div>
 
<div id="menu">
	<div id="up_menu">
	Acceuil
	</div>
	<div id="in_menu">
	.: Presentation :.
	</div>
	<div id="foot_menu">
	</div>
</div>
 
<div id="corps">
</div>
<div id="pied">
..:: design by keub ::..
</div>
</body>
</html>

[keub51]

autre probleme :

firefox considere que mon body sarete a la baniere .. IE lui non il prend tout ...

[Candygirl]

- japplique un padding dans un flotant :
IE ne redimensionne pas le cadre
Firefox redimensionne le cadre

Code html :

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

1
2
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Le problème est que IE6 ne prend pas en compte le doctype si ce dernier n'est pas tout en haut du document (ici, typiquement, tu as la déclaration xml avant) et reste donc en mode quirks au lieu de passer en mode standard.

Tu dois donc faire avec le modèle de boîte de Microsoft, qui inclu le padding dans le width, alors que celui du w3c ajoute le padding au width.

[keub51]

merci