28172 sujets

CSS et mise en forme, CSS3

Fond qui ne se décale pas

Bonjour à tous,

dernier "gros" bug de mon nouveau design en construction est sur ie6 et 7 (pour changer, hein ^^). Je vous invite tout simplement à aller le voir vous meme avec IE 7 à cette adresse : http://www.designspartan.com.
Alors voila, pour une grande résolution (moi qui suis en 1680*1050) le site est OK sur tous les navigateurs. Sur FF, il est optimisé jusqu'a 1024, ce qui est bon mais pas sur IE... En fait dès que la largeur du navigateur est inférieur à 1320 px environ, le fond qui est centré ne se décale plus vers la gauche avec le reste du site quand on réduit le navigateur.

Sinon je n'ai "que" 3 erreurs css au validator venant de padding inférieur mais je doute que cela vienne de ca. J'ai cherché la solution durant bien trop longtemps sans trouvé et j'avoue ne pas trouvé l'erreur.

Mon HTML 

<body>
<head>
blablabla
</head>

<body>

<div id="astuce">
<div id="page">



<div id="header">

<div id="menu_header">
<ul id="menu">
<li><a id="menu-home" href="http://www.designspartan.com/">Accueil<span></span></a></li>
<li><a id="menu-tuto" href="http://www.designspartan.com/tag/tuto-par-spartan/">Tutoriels de Spartan<span></span></a></li>
<li><a id="menu-archives" href="http://www.designspartan.com/archives-du-blog/">Archives<span></span></a></li>

<li><a id="menu-about" href="http://www.designspartan.com/a-propos-de/">About<span></span></a></li>
<li><a id="menu-contact" href="http://www.designspartan.com/a-propos-de#contact">Contact<span></span></a></li>
</ul>

<ul id="menu2">
<li><a id="menu-rss" href="?feed=rss2">RSS<span></span></a></li>
</ul>


</div>

</div>

Tout le contenu

<div style="clear:both"></div>
</div>
<div id="footer">
<div id="cont_footer">
   <li><h2>:</h2>
   <ul><li id="get-recent-comments" class="widget widget_get_recent_comments"><h2 class="widgettitle">Recent Comments</h2><div id="get_recent_comments_wrap"><ul>	<li><a href="http://www.designspartan.com/presentation/presentation-dan-mumford/#comment-272" title="Présentation : Dan Mumford, 5 juillet 2008">Zeldamaster</a>: C&#8217;est génial ce mec à un style qui lui appartient, et ce...</li>

	<li><a href="http://www.designspartan.com/general/nouveau-design-sur-design-spartan/#comment-271" title="Nouveau Design sur Design Spartan !, 4 juillet 2008">lazy</a>: Bon vu que je l&#8217;avais vu avant et que je t&#8217;ai déjà dis que...</li>
	<li><a href="http://www.designspartan.com/tutoriels/2-tutoriels-splash-design-et-le-style-coldplayapple/#comment-270" title="2 Tutoriels : Splash Design et le style Coldplay/Apple, 24 juin 2008">Design Spartan</a>: De rien <img src='http://www.designspartan.com/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </li>
	<li><a href="http://www.designspartan.com/general/nouveau-design-sur-design-spartan/#comment-269" title="Nouveau Design sur Design Spartan !, 4 juillet 2008">Design Spartan</a>: Tant mieux Narf, le but n&#8217;est pas de paraître...</li>
	<li><a href="http://www.designspartan.com/general/nouveau-design-sur-design-spartan/#comment-268" title="Nouveau Design sur Design Spartan !, 4 juillet 2008">Narf</a>: Petit commentaire de passage : je dirais que cette version fait moins gamer [cligne]...</li>

</ul></div></li></ul>
   </li>
   

</div>
</div>
</div>
</div>

	
</body>
</html>



MON CSS:


body {


	background: RGB(37,30,50) url(images/fond_body.jpg) repeat-y
center top;
	font-size: 62.5%; /* Resets 1em to 10px */
	font-family: 'Lucida Grande', Verdana, Sans-Serif;
	color: #000;
text-align: center;

	}


#astuce {
 
margin: auto;
margin-top: -20px;
height: 954px;
background: url(images/diz_body.jpg) no-repeat center top;

#page {

	background: none;

	text-align: left;
	margin: 20px auto;
	padding: 0 0 0 80px;
        padding-top: 20px;
	width: 890px;

	}

}


Je précise que comme vous pouvez le constater, le tout marche relativement bien sur FF donc le prob doit venir de modifs a faire sur IE ou alors d'erreurs que seul IE prend en compte j'imagine.
Pour IE j'ai mis des border:

Rouge pour <body>

Bleu pour <div id="astuce"

Vert pour <div id="page">

Je me repose sur vous et vous remercie d'avance Smiley smile
Modifié par spartouille (06 Jul 2008 - 13:08)
Bonjour,

Hallucinant, personne ne trouve l'erreur ? le fond appliqué à body agit un peu comme si body avait une largeur, ce qui n'est pas le cas. Ca m'attriste un peu de n'avoir aucune réponse mais bon... Smiley ohwell
Sujet clos
Aller à