Disposition div : différences IE7/FF3

**flzox** · 11/11/2008, 12h30

Bonjour,
voici le code d'une page 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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="../CSS/monStyle.css" rel="stylesheet" />
<title>MaPage</title>
</head>
 
<body>
 
<div id="container">
 
<div id="menu">
	<ul>
	<li><a href="Page1.htm" target="monIFrame">lien1</a></li>
	<li><a href="Page2.htm" target="monIFrame">lien2</a></li>
	<li><a href="Page3.htm" target="monIFrame">lien3</a></li>
	<li><a href="Page4.htm" target="monIFrame">lien4</a></li>
	<li><a href="Page5.htm" target="monIFrame">lien5</a></li>
	<li><a href="Page6.htm" target="monIFrame">lien6</a></li>
	</ul>
</div>
 
 
<div id="content">
<iframe name="monIFrame" width="100%" height="600px" align="middle" src="Page1.htm" frameborder="0">Votre navigateur ne supporte pas les frames</iframe>
</div>
 
</div>
</body>
</html>

et le code CSS correspondant :

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
 
body
{
	background-image:url(../Images/Main.png);
	background-repeat:repeat-x;
}
 
#menu
{
	float:left;
	position:relative;
	margin-top:70px;
}
 
#container
{
}
 
#content
{
position:relative;
margin-top: 120px;
margin-left:150px;
background-color: rgb(255,255,255);
}
 
div
{
	border:1px solid;
}
 
ul
{
list-style:none outside none;
}
 
li
{
color:blue;
	margin-left:-15px;
	list-style-image:none;
}

Problème, j'ai mis une bordure aux div pour la phase de design, mais lorsque je l'enlève ... sur FF les div sont décalées (pas sur IE).

Quelqu'un aurait-il une explication ?

Merci d'avance.

**c_s_s** · 11/11/2008, 15h09

Tu peux te renseigner sur le Modele de Boite (ou encore le mode Quirks), ça répondra à ta question.

Avec le doctype que tu utilises, certains navigateurs vont prendre en compte la largeur des bordures pour calculer la largeur totale d'un bloc, alors que d'autres navigateurs ne le feront pas.

Bonnes recherches.

**flzox** · 11/11/2008, 17h31

Merci, pour l'instant j'ai contourné le problème en mettant une bordure de couleur transparente.
Bidouillage pas top mais bon ça passe ...

Disposition div : différences IE7/FF3

CSS

Vue hybride

Discussions similaires

Partager

Partager