différence margin entre IE et FF

**patk29** · 03/11/2010, 08h05

Bonjour,

je cherche à résoudre un problème de margin top, margin left entre IE et FF.

j'ai positionné un slide show en js sous FF et celui ci se retrouve à une autre position sous IE (plus bas et plus a droite).

comment faire pour faire coincider la même position sous les 2 navigateurs ?

merci

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
html>
<head>
<title>blog</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.slideshow { height: 232px; width: 232px; margin: auto }
.slideshow img { margin-top: 195px;  margin-left: 250px; padding: 15px; border: 1px solid #ccc; background-color: #eee; }
</style>
<!-- include jQuery library -->
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
 
<!-- include Cycle plugin -->
<script type="text/javascript" src="jquery.cycle.all.js"></script>
 
<!--  initialize the slideshow when the DOM is ready -->
<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
		fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
	});
});
 
</script>
 
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (blog.psd) -->
<table id="Tableau_01" width="1001" height="800" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td colspan="5">
			<img src="images/blog_01.gif" width="1000" height="194" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="194" alt=""></td>
	</tr>
	<tr>
		<td colspan="3">
			<img src="images/blog_02.gif" width="247" height="79" alt=""></td>
		<td class="slideshow" rowspan="6">
 
		<img src="galerie/img003.jpg" width="655" height="420" >
		<img src="galerie/img009.jpg" width="655" height="420" >
		<img src="galerie/img010.jpg" width="655" height="420" >
		<img src="galerie/img013.jpg" width="655" height="420" >
		<img src="galerie/img019.jpg" width="655" height="420" >
 
		</td>
		<td rowspan="7">
			<img src="images/blog_04.gif" width="62" height="606" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="79" alt=""></td>
	</tr>
	<tr>
		<td rowspan="6">
			<img src="images/blog_05.gif" width="42" height="527" alt=""></td>
		<td>
			<a href="index.html" target="_self">
				<img src="images/accueil.gif" width="109" height="29" border="0" alt=""></a></td>
		<td rowspan="6">
			<img src="images/blog_07.gif" width="96" height="527" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="29" alt=""></td>
	</tr>
	<tr>
		<td>
			<a href="infos.html" target="_self">
				<img src="images/infos.gif" width="109" height="29" border="0" alt=""></a></td>
		<td>
			<img src="images/spacer.gif" width="1" height="29" alt=""></td>
	</tr>
	<tr>
		<td>
			<a href="galerie.html" target="_self">
				<img src="images/galerie.gif" width="109" height="28" border="0" alt=""></a></td>
		<td>
			<img src="images/spacer.gif" width="1" height="28" alt=""></td>
	</tr>
	<tr>
		<td>
			<a href="contact.html" target="_self">
				<img src="images/contact.gif" width="109" height="29" border="0" alt=""></a></td>
		<td>
			<img src="images/spacer.gif" width="1" height="29" alt=""></td>
	</tr>
	<tr>
		<td rowspan="2">
			<img src="images/blog_11.gif" width="109" height="412" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="259" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/blog_12.gif" width="691" height="153" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="153" alt=""></td>
	</tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>

**Bisûnûrs** · 03/11/2010, 08h52

Avoir un DOCTYPE complet et valide ne serait déjà pas du luxe.
Ensuite, on n'a aucune de tes images, donc difficile d'avoir un rendu correct pour visualiser ton problème dans les meilleures conditions.
Enfin, les pré-découpes de Photoshop, ou je ne sais quel logiciel de graphisme, ne sont pas ce qu'il y a de mieux pour faire un site web. Ca donne un code pourri, immaintenable et pas du tout optimisé.

**patk29** · 03/11/2010, 11h15

je reconnais que le code généré par photoshop est pas top.

difficile pour se rendre compte de mettre tous les fichiers. Quoi qu'il en soit j'ai testé avec firefox, safari, chrome le positionnement est parfait avec ce code seul IE pose des problèmes.

**Bisûnûrs** · 03/11/2010, 12h11

Si tu pouvais nous mettre un exemple en ligne ça serait top.

**patk29** · 04/11/2010, 09h24

voila site en construction à voir ici :

http://carnetsmex.pagesperso-orange.fr/galerie.html

**Bisûnûrs** · 04/11/2010, 10h29

Ouais, donc comme déjà par ça :

Envoyé par Bisûnûrs

Avoir un DOCTYPE complet et valide ne serait déjà pas du luxe.

**patk29** · 04/11/2010, 11h49

j'ai ajouté :

Code :

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

1
2
<!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" xml:lang="fr">

ça ne règle rien et en plus ça ajoute des décalages avec tous les navigateurs !!

**theo77186** · 11/11/2010, 13h53

Envoyé par Bisûnûrs

Avoir un DOCTYPE complet et valide ne serait déjà pas du luxe.
Ensuite, on n'a aucune de tes images, donc difficile d'avoir un rendu correct pour visualiser ton problème dans les meilleures conditions.
Enfin, les pré-découpes de Photoshop, ou je ne sais quel logiciel de graphisme, ne sont pas ce qu'il y a de mieux pour faire un site web. Ca donne un code pourri, immaintenable et pas du tout optimisé.

Oui c'est un problème de IE qui implémente le CSS correctement qu'avec un DOCTYPE

différence margin entre IE et FF

CSS

Vue hybride

Discussions similaires

Partager

Partager