28172 sujets

CSS et mise en forme, CSS3

Problème d'alignement entre EI et FF

Bonjour.

J'essaie de résoudre ce problème des heures mais je n'y arrive pas.
Merci de m'aider
ma page index 
<body>
<div id="global">
<div id="haut">
<table border="0px" cellpadding="0px" cellspacing="0px" style="width:1000px; border-color: white; FILTER: 
			progid:DXImageTransform.Microsoft.GRADIENT(startColorstr='#0000CC' 
			,endColorstr='#ffffff' ,gradientType='0' bgColor='#ffffff' scroll='yes'">
	<tr>	
		<td id="tablehautcol1">H2R Consultants</td>
		<td valign="bottom" style="width:450px"><img src="images/bandeau-2.jpg" style="width:450px"></td>
		<td id="tablehautcol2" style="color:#FFFF00">Société de traduction</td>
	</tr>
</table>
<div style="height:18px">
<table border="0px" cellpadding="0px" cellspacing="0px" style="width:1000px;height:18px; font-family:tahoma; font-size:12px" cellpadding="0px" cellspacing="0px">
	<tr style="background-color:#FFFFFF">
		<td style="background-image:url('images/fond_ariane.GIF'); width:762px"><span style="margin-left:200px; color:#FFFF00"> Vous êtes ici <img src="images/ariane.GIF" alt="" />
			<?php 
			if (!isset($_GET['page'])) $page= 'fr_accueil'; else $page= $_GET['page'];  
			switch($page){
				//menu horizontal
				case 'fr_accueil': echo("Accueil");break;
				case 'fr_competences': echo ("Domaines de traduction");break;
				case 'fr_references': echo ("Références");break;
				case 'fr_tarif': echo ("tarif");break;
				case 'fr_devis': echo ("Devis");break;
				case 'fr_contacts': echo ("Vos contacts");break;
			}
			?>
			</span>
		</td>
		<td><img src="images/angle_ariane.GIF"></td><td style="background-color:#ffffff; width:183px"></td>
	</tr>
</table>	
</div
</div>
<div id="gauche" style="background-image:url('images/background.GIF')">
<table border="0" style="color:#ffffff; align:center; font-family:tahoma; font-size:12px">
	<tr>
		<td><a href="english.php"><img src="images/yd_gr-bretagne.gif" alt="" style="height:35px; border:none"/></a></td><td colspan="2"><a href="english.php">English</a></td><td></td>
	</tr>
	<tr>
		<td></td><td><a href="espagnol.php"><img src="images/yd_espagne.gif" alt="" style="height:35px; border:none" /></a></td><td><a href="espagnol.php">Espa&ntilde;ol</a></td>
	</tr>
	<tr>
		<td colspan="2" align="right"><a href="italien.php">Italiano</a></td><td>&nbsp;<a href="italien.php"><img src="images/yd_italia.gif" alt="" style="height:35px; border:none" /></a></td>
	</tr>
</table>
<span style="color:white; margin-left:10px">================</span>
<div id="menu">
<table>
	<tr>
		<td>
			<a href="index.php?page=fr_accueil"><img src="images/menu_fr/accueilAA.gif" alt="" style="border:none"></a>
			<br /><a href="index.php?page=fr_competences"><img src="images/menu_fr/domaineAA.gif" alt="" style="border:none"></a>
			<br /><a href="index.php?page=fr_references"><img src="images/menu_fr/referencesAA.gif" alt="" style="border:none"></a>
			<br /><a href="index.php?page=fr_tarif"><img src="images/menu_fr/tarifAA.gif" alt="" style="border:none"></a>
			<br /><a href="index.php?page=fr_devis"><img src="images/menu_fr/devisAA.gif" alt="" style="border:none"></a>
			<br /><a href="index.php?page=fr_contacts"><img src="images/menu_fr/contactsAA.gif" alt="" style="border:none">
		</td>
	</tr>
</table>
</div>
</div>
<div id="conteneur">
<?php 
if (!isset($_GET['page'])) $page= 'fr_accueil'; else $page= $_GET['page'];
	switch($page){
		//menu horizontal
		case 'fr_accueil': include ('lg_francais/accueil.php');break;
		case 'fr_competences': include ('lg_francais/traduction/fr_competences.php');break;
		case 'fr_references': include ('lg_francais/traduction/fr_references.php');break;
		case 'fr_tarif': include ('lg_francais/traduction/fr_tarif.php');break;
		case 'fr_devis': include ('lg_francais/traduction/fr_devis.php');break;
		case 'fr_contacts': include ('lg_francais/traduction/fr_contacts.php');break;


		case 'en_accueil': include ('lg_anglais/en_accueil.php');break;
		case 'it_accueil': include ('lg_italien/it_accueil.php');break;
}
?>
</div>
<div id="droit" style="background-image:url('images/background.GIF')">
<?php	include ('lg_francais/fr_droit.php'); ?>
</div>
<div id="pied">
<?php	include ('lg_francais/fr_pied.php'); ?>
</div>
</div>
</body>

le fichier css
body {
	margin: 0;
	padding: 0;
	background-color: #CCCCFF;
	font-family: tahoma;
	font-size:12px;
}
#global {
	width:1000px;
	margin-left:auto;
	margin-right:auto;
	background-color: #CCCCFF;
}
#haut {
	background: blue;
	height:101px;
	width:1000px;
	margin-left:auto;
	margin-right:auto;
}
#tablehautcol1 {
	font-family: lucida handwriting;
	font-size:30px;
	color:#ffffff;
	width:330px;
	text-align:center;
}
#tablehautcol2 {
	font-family: tahoma;
	font-size:20px;
	color:#ffffff;
	text-align:center;
}
#gauche {
	color: #000;
	padding: 0px;
	width:160px;
	margin-top:0px;
	min-height:520px;
}
#menu {
	margin-left:20px;
	margin-top:20px
}
#conteneur {
	position: absolute;
	top :101px;
	margin-left:160px;
	color: #FFFFFF;
	background-color: #0033FF;
	font-size:14px;
	font-family: tahoma;
	padding: 0px;
	width:670px;
	min-height:620px;
}
#droit {
	position: absolute;
	top : 101px;
	left : 959px;
	width:150px;
	min-height:520px;
	color: #FFFFFF;
	font-family: tahoma;
	font-size:13px;
}
#pied {
	position: relative;
	top : 0px;
	left : 0px;
	color: #000;
	background-color: #FFFF00;
	padding: 0px;
	width:1000px;
	height:30px;
	font-family: tahoma;
	font-size:13px;
}

Merci d'avance
Euh, oui...

Ca serait plus simple si tu commençais par nous dire quel est le problème déjà ^^

Ensuite, tu n'es peut-être pas forcé de nous poster tout le code (avec du PHP par dessus le marché) pour ton problême, si ?

Et pour finir, même sans savoir ce qu'est ton soucis, vu la soupe de tableau, déclarations inlines et déclarations propriétaires, la première chose à faire serait de refaire ça proprement.
Désolé si je n'ai pas été clair Smiley decu
Mon problème est que l'alignement des différents div est correct sous EI mais pas sous FF.
Je remets le code ma page index mais simplifié cette fois
<!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">
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<div id="global">
<div id="haut">
*** ici le contenu du div haut ***
<div style="height:18px">
*** ici je place un fil d'ariane ***
</div>
</div>
<div id="gauche" style="background-image:url('images/background.GIF')">
*** ici un tableau qui contient des liens vers différentes langues ***
<div id="menu">
**** ici le menu ***
</div>
</div>
<div id="conteneur">
*** ici affichage des pages ***
</div>
<div id="droit" style="background-image:url('images/background.GIF')">
<?php	include ('lg_francais/fr_droit.php'); ?>
</div>
<div id="pied">
<?php	include ('lg_francais/fr_pied.php'); ?>
</div>
</div>
</body>


Pour le moment le site est sur ma page perso http://p.fontayne.club.fr
Voilà j'espère que c'est plus clair, et merci pour l'aide
a écrit :
Mon problème est que l'alignement des différents div est correct sous EI mais pas sous FF.

EI ? Eternet Inxplorer ? Smiley cligne

Plus sérieusement, c'est effectivement plus clair et le premier conseil que je peux te donner c'est de faire valider ta page => http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fp.fontayne.club.fr%2Findex.php

Si cela ne suffit pas, c'est de réecrire cela proprement sans utiliser de tableau, on sera alors beaucoup plus à même de t'aider.
Modifié par Tymlis (08 Oct 2008 - 13:54)
Sujet clos
Aller à