Pb Background sous IE6

[captusite]

Bonjour,

Je suis en train de verifier ma feuille de style pour cette page

http://www.allo-france.com/beta/maquette3.htm

Sous FF et IE7 pas de probleme, si ce n'est la petite bordure grise manquante du fond jaune sur IE7.

Mais sous IE6 le fond jaune ne s'affiche pas du tout.

Pire, il s'affiche uniquement si je scrolle jusqu'en bas de la page avec le pointeur de la souris sur le menu de gauche ... :cry: et en plus le fond jaune est par dessus le texte ????

Voici ma feuille de style:

(les selecteurs #contenu_cadre et #produit on un comportement bizarre)

* {
	margin:0;
	padding:0;
}
body {
	margin:0;
	padding:0;
	background-color:#99CCFF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
h1, h2 {
	text-indent:-5000px;
	font-size:1px;
	color:#xxxxxx;
	margin:0;
}
/** Gabarits de mise en page global **/
#conteneur_global {
	position: relative;
	width: 960px;
	margin: 0 auto; 
}
#conteneur_central {
	margin-top:5px;
}
#centre {
	margin-left:215px;
}
#gauche {
	float:left;
	margin-right:15px;
}
.separateur {
	clear:both;
}

/** Entete du site **/
#header {
	height:100px;
	width:960px;
	background-image:url(Design/bg_stripe.jpg);
	background-position:top left;
	background-repeat:no-repeat;
	margin-bottom:0;
}
#header img {
	margin:6px 0 6px 6px;
}
#header object {
	float:right;
	margin:15px 15px 15px 0;
}
#header_nav {
	background-image:url(Design/bg_nav.gif);
	background-repeat:no-repeat;
	background-position:top left;
	height:28px;
	width:960px;
	margin-top:0;
}
#header_nav p {
	padding:6px 0 6px 138px;
	color:#FFFF99;
	font-size:11px;
	font-weight:bold;
	margin:0;
}
#a_topnav a {
	color:#FFFF99;
	text-decoration:none;
}
#a_topnav a:hover {
	color:#000099;
	background-color:#FFFF99;
}
#header_cart {
	float:right;
	margin:6px 10px 6px 0;
}
/** Bloc de publicité **/
.Pub_728x90 {
	background-repeat:no-repeat;
}
.Pub_200x100 {
	background-repeat:no-repeat;
}
/** Bloc menu de gauche **/
#menu_gauche {
	width:200px;
}
#menu_gauche_top, #menu_gauche_bottom {
	height:11px;
	background-repeat:no-repeat;
	font-size:1px; /*correction de bogue IE */
}
#menu_gauche_top {
	background-image:url(Design/menu_gauche_top.gif);
}
#menu_gauche_bottom {
	background-image:url(Design/menu_gauche_bottom.gif);
}
#contenu_menu_gauche {
	margin:0;
	border-left:1px solid #666;
	border-right:1px solid #666;
	background-color:#FFF;
	text-align:center;
}
#contenu_menu_gauche span {
	color:#000099;
	font-size:14px;
	font-weight:bold;
}
#contenu_menu_gauche h3 {
	display:block;
	height:16px;
	color:#FFFFFF;
	background-color:#6E87BD;	
	font-size:12px;
	padding:5px 0;
	margin:0;
}
#contenu_menu_gauche ul {
	margin:5px;
	padding:0;
	text-align:left;
	list-style-type:square;
	list-style-position:inside;
	color:#000099;
	font-size:11px;
}
#contenu_menu_gauche li {
	margin:0;
	padding:0;
}
#contenu_menu_gauche a {
	margin:0;
	text-decoration:none;
	color:#000099;	
}
#contenu_menu_gauche a:hover {
	background-color:#6E87BD;
	color:#FFFFFF;	
}

/** Bloc contenu centrel **/
#cadre {
	background-color: #FFFFFF;
	margin:0;
}

#cadre_top, #cadre_bottom {
	height:11px;
	background-repeat:no-repeat;
	font-size:1px; /*correction IE6 */
}
#cadre_top {
	background-image:url(Design/cadre_top.gif);
	background-color:#FFFFFF; /*correction IE6 */
	margin:0;

}
#cadre_bottom {
	background-image:url(Design/cadre_bottom.gif);
	margin:0 0 10px 0;
}
#contenu_cadre {
	border-left:1px solid #666;
	border-right:1px solid #666;
	padding:0;
	margin:0;
}

#intro_cadre {
}
ul#tabnav {
    font-size: 11px;
    list-style-type: none;
    padding-bottom: 24px;
    border-bottom: 1px solid #999;
    margin: 0;
}
ul#tabnav li {
    float: left;
    height: 21px;
    background-color: #FFF;
    margin: 2px 2px 0 2px;
    border: 1px solid #999;
}
ul#tabnav li.activetab {
	float: left;
    height: 17px;
    margin: 2px 2px 0 2px;
	padding: 4px 4px 0 4px;
    border-top: 1px solid #999;
	border-left: 1px solid #999;
    border-right: 1px solid #999;
	font-weight:bold;
	color:#666;
	background-color: #FFF;
}
#tabnav a {
    float: left;
    display: block;
    color: #666666;
    text-decoration: none;
    padding: 4px;
}
#tabnav a:hover {
    background-color:#EBEBEB;
}
#produit {
	padding:11px;
	margin:0;
	font-size:12px;
	/*border-left:1px solid #666;*/

}
.prod_titre, .prod_sstitre {
	padding:0 11px 0 11px;
}
.prod_titre {
	font-size:14px;
	font-weight:bold;
	color:#000099;
}
.prod_sstitre {
	font-size:11px;
	color:#FF0000;
}

#diapo {
	float:right;
}
/**** Tableau de produits *****/

.TableauPrix {
	border: 1px solid #999999;
	border-collapse: collapse;
	margin:10px 0 10px 0;
	width:490px;
}

.EnteteTableauPrix{
	background-color:#999999;
	color:#FFFFFF;
	font-size:12px;
	font-weight:bold;
	text-align:center;
}
.LignesTableauPrix {
	border-top: 1px dotted #999999;
	height: 30px;
	background-color:#FFFFFF;
	font-size:12px;
}

/** Pied de page **/
#footer {
	margin-top:5px;
}
#contenu_footer {
	border-left:1px solid #666;
	border-right:1px solid #666;
	background-color:#FFF;
	text-align:center;
	font-size:10px;
	margin:0;
}
#footer_top, #footer_bottom {
	height:11px;
	background-repeat:no-repeat;
	font-size:1px; /*correction de bogue IE */
}
#footer_top {
	background-image:url(Design/footer_top.gif);
}
#footer_bottom {
	background-image:url(Design/footer_bottom.gif);
}

Merci pour votre aide précieuse ...

[ghost]

Bonjour,

Un position relative dans un le bloc #contenu_cadre devrait stabiliser ton problème pour le fond quant a avoir les bordures c'est une autre histoire !!

La structure de ton code est un peu tirée par les cheveux (tes blocs ne sont pas dimensionnés) et ne sera jamais trop stable, il vaudrait mieux utiliser le système des colonnes factices.

Bon courage.

[captusite]

merci ghost,

j'ai mon fond jaune ok grace au position:relative; mais maintenant c'est ma naviguation en TAB et les pub a droite qui ne s'affichent plus.

Quel casse tete !!

Je pense que je vais revoir ma partie centrale avec le systeme de colonnes factices comme tu dis.

Je débute en css et c'est vrai que cette maquette me donne du fil a retordre.

Merci encore

[MarvinLeRouge]

Salut,

Peut-être un truc comme

*
{
  zoom : 1;
}

dans une feuille de style spécifique IE6 ? (tentative au jugé)