Me revoila avec un nouveau soucis : IE 6 (oui rien d'original).
Mon site d'affiche comme je veux sous Firefox mais evidemment IE fait la gueule. En fait le contenu du DIV droite s'affiche en décalé, comme si le contenu du DIV gauche était au dessus.
Je ne trouve pas de solution pour éviter ça...
Voila le code de la page et du CSS :
<!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=iso-8859-1" />
<title>Terrains et Villages - le batiment integral</title>
<link rel="stylesheet" type="text/css" href="css/testcss.css" media="screen" />
<link rel="icon" type="image/png" href="favicon.ico" />
<!-- Javascript Swf Object -->
<script type="text/javascript" src="flash/js/swfobject.js"></script>
<!-- Mise en forme CSS -->
<style type="text/css">
@import "flash/css/global-flash.css";
</style>
<SCRIPT LANGUAGE="JavaScript">
function makeArray(n) {
this.length = n;
for (var i=1; i<=n; i++) {
this[i] = "";
}
return this;
}
var i;
function imagealeatoire() {
i = Math.floor(2 * Math.random() + 1);
return image[i];
}
image = new makeArray(2);
image[1]="images/icone1.jpg";
image[2]="images/icone2.jpg";
</SCRIPT>
</head>
<div id="global">
<div id="header">
<div id="flashcontent">
<object data="flash/banniere.swf" type="application/x-shockwave-flash" id="altswf">
<param name="movie" value="flash/banniere.swf" />
<param name="quality" value="high" />
<p id="alternate">
<span class="title">Flash Player non détecté</span>
Pour visualiser le contenu de ce site installez la dernière version du <strong>Flash Player</strong> en cliquant ici :
<br />
<a href="http://www.macromedia.com/go/getflash/" title="Télécharger Flash Player"><img src="flash/images/get_flash_player.gif" /></a>
<br />
Si cela est deja fait vérifiez dans les options de votre navigateur si il n'est pas désactivé.
<span class="copyright">© Baldy</span>
</p>
</object>
</div>
<script type="text/javascript">
// <![CDATA[
var so = new SWFObject("flash/banniere.swf", "banniere", "750", "200", "10", "#FFFFFF",true);
so.addParam("quality", "high");
so.addParam("menu", "false");
so.write("flashcontent");
// ]]>
</script>
</div>
<div id="menu">
<ul id="liens">
<li class="lienmenu"><a href="#">Société<span>Présentation de l'entreprise</span></a></li>
<li class="lienmenu"><a href="#">Activités<span>Nos domaines de compétence</span></a></li>
<li class="lienmenu"><a href="#">Réalisations<span>Exemples de projets</span></a></li>
<li class="lienmenu"><a href="#">Moyens<span>Un gage de qualité</span></a></li>
<li class="lienmenu"><a href="#">Chantiers<span>En cours et à venir</a></span></li>
<li class="lienmenu"><a href="#">Références<span>Nos partenariats</span></a></li>
<li class="lienmenu"><a href="#">Contacts<span>Vos possibilités</span></a></li>
<li class="clr"></li>
</ul>
</div>
<div id="centre">
<div id="gauche">
Menu possible<br /><br />
<center>
<SCRIPT LANGUAGE="JavaScript">
document.write("<IMG SRC=" +imagealeatoire() +" WIDTH=140 HEIGHT=200 BORDER=0>");
</SCRIPT>
</center>
</div>
<div id="droite">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<br /><br />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<br /><br />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<br /><br />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<br /><br />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<br /><br />
</div>
</div>
</div>
<body>
</body>
</html>
html, body {
height:100%;
width:100%;
overflow:auto;
}
body {
font: 90% "Trebuchet MS", sans-serif;;
background-image:url(../images/essai.jpg);
background-repeat: repeat-x repeat-y;
margin: 0;
padding: 0;
}
#global {
width:750px;
margin: 5px auto 0 auto;
border: none;
background-color:#FFFFFF;
}
#header {
width: 100%;
height: 210px;
height: 201px;
position:relative;
}
#menu {
width: 100%;
margin: 0 0 0 0;
border: none;
}
#liens {
list-style-type:none;
margin: 0 auto 0 auto;
padding: 0;
width: 707px;
}
li.lienmenu {
margin-right: 1px;
float: left;
}
li a {
display:block;
padding: 5px;
width: 90px;
text-decoration:none;
color:#FFFFFF;
text-align:center;
background-color:#006633;
}
.lienmenu a:hover {
background-color:#00CC00;
}
li a span {
display:none;
}
li a:hover span {
font-size: 9px;
/* clear:both;*/
display:block;
margin-top:5px;
position:absolute;
margin-left:10px;
background-color: #009966;
padding:3px;
white-space: nowrap;
border:1px dotted #996699;
cursor:pointer;
}
.clr {
clear:both;
}
#centre {
padding: 2px 0 0 0;
background: url(../images/fond_centre.jpg) repeat-y;
}
#gauche {
position:fixed;
width:150px;
height:100%;
padding: 0 0 0 2px;
}
#droite {
height:100%;
margin-left:155px;
overflow:auto;
}
[/i][/i]