28172 sujets

CSS et mise en forme, CSS3

[résolu] Site centré avec bandeau en arrière plan

bonjour tout le monde,
je voudrais réaliser la mise en page suivante: un site centré avec, en arrière plan, un bandeau qui fait toute la largeur :
upload/16107-ex.jpg

Pour ce faire, j'utilise le code suivant:
<!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">
<body style="margin:0;padding:0;text-align:center;">
<div id="bandeau" style="position:absolute;width:100%;margin:115px 0;padding:0;z-index:0;background-color:#ccc;height:111px;"></div>
<div id="site" style="position:relative;width:900px;height:500px;margin:0pt auto;z-index:200;background-color:#333;border:solid 1px #666;"></div>
</body>
</html>

Le problème est que cela ne fonctionne pas sous IE (le bandeau se décale à droite).. j'ai essayé d'autres solutions, notamment la technique du "left:50%;margin-left:-450px;" pour centrer le site, mais en faisant ça, lorsque je le retaille, il disparait sur la gauche...

J'ai remarqué que lorsque je passe le site en display:none, le bandeau s'affiche au bon endroit ! alors je commence à sécher ... Smiley confused

merci pour votre aide
Modifié par _emilie (17 Mar 2008 - 15:43)
Salut,

Et en passant ton bandeau en background-image de ton body?

body{
background-image: url(ton-image);
background-repeat: no-repeat;
background-position: center XXpx;
...
}
Sujet clos
Aller à