28172 sujets

CSS et mise en forme, CSS3

[résolu]Float non pris en compte par ie6

Bonjour a tous,

Je viens à vous car voici mon problème, débutante en css, je suis en traine d'adapter mon site pour Ie6 et mon problème est que j'ai un menu a gauche avec un contenu a droite et que le fameux contenu malgré les float, overflow:hidden, display:inline et height:1% reste toujours en bas.

Le menu et son contenu sont tous les deux dans une div "centre"

Si vous pouvez m'aider, merci beaucoup pour vos réponses !

voici mon code css


.centre{
	background:url('../images/fond.jpg') repeat-y;
	width:956px;
	margin-left:2px;
	float:left;
	overflow:hidden;
	}
	
/****Menu de gauche****/
.menug{
	background:#dfdfdf;
	padding-top:75px;
	/*min-height:555px;*/
	border-right:#d9d9d9 solid 1px;
	text-decoration:none;	
	font-size:13px;
	width:184px;
	/*margin-left:1px;*/
	display:block;
	}
	
.menug ul li{
	margin-top:5px;
	}
	
.menug ul li a:visited{
	color:#3b3b3b;
	}

.menug ul .inactif{	
	/*width:185px;*/
	text-decoration:none;
	background:url('../images/btn-gris.jpg') no-repeat;
	font-weight:bold;
}

.menug ul .actif {
	width:185px;	
	background:url('../images/btn-jaune.jpg') no-repeat;	
}

.menug ul a:hover{
	background:url('../images/btn-hover-jaune.jpg') no-repeat;
	font-weight:bold;
	color:#3b3b3b;	
	}

.menug ul .actif a:visited{
	font-weight:bold;
	color:#3b3b3b;	
	}
	
.menug a{
	text-decoration:none;
	color:#3b3b3b;
	display:block;	
	height:27px;
	padding-left:10px;
	padding-top:8px;
	}
	
/****Sous-Menu****/

.actif .ssmenu{
	padding:0 0 0 0;	
	margin:0 0 0 0;
	background:#eeeeee;
	}

.actif .ssmenu .niv2{
	/*padding-top:5px;*/
	padding-bottom:15px;
	margin-top:0px;
	border-bottom:1px dotted #a0a0a0;
	height:10px;
}
	
.actif .ssmenu .niv2 a{
	background-image:url('../images/carre-gris.gif');
	background-repeat: no-repeat;
 	background-position: 0px 9px;
	margin-left:20px;	
	text-decoration:none;
	padding:2px 0 0 15px;	
	font-weight:100;
	}
	
.actif .ssmenu .niv2 a .actif{
	font-weight:bold;
	}

.actif .ssmenu .niv2 a:hover{
	background-image:url('../images/carre-jaune.gif');
	background-repeat: no-repeat;
 	background-position: 0px 9px;
	color:#CC6600;
	font-weight:100;	
}

.actif .ssmenu .niv2 a:visited{
	font-weight:100;
	}

	
/****contenu*****/

#contenu{
	background-color:white;
	width:770px;/*ie*/
	margin-left:92px;
	/*margin-top:-270px;/*ie6*/
	display:inline-block;
	float:left;

	}
	
#contenu .photo{
	width:758px ;/*ie*/
	height:220px;
	}
	
#contenu #entreprise{
	width:360px;
	font-size:12px;
	text-align:justify;
	margin-top:10px;
	margin-left:20px;
	margin-bottom:20px;
	}
	
/*=bloc promo1=*/
	
#contenu #promo{
	width:359px;
	margin-left:23px;	
	text-align:justify;	
	}
	
#contenu #promo h3{
	border-left:#bdbdbd solid 1px;
	border-right:#bdbdbd solid 1px;
	padding-left:10px;
	}
	
#contenu #promo p{
	border-left:#bdbdbd solid 1px;
	border-right:#bdbdbd solid 1px;
	background:#fff url('../images/promo-bgk.jpg') repeat-x left bottom;
	font-size:11px;
	min-height:90px;
	padding-left:10px;
	padding-right:10px;
	margin:0 0 0 0;
	}
	
#contenu #promo p .lien{
	background:url('../images/btn-savoirplus.gif') no-repeat;
	padding-top:2px;
	padding-left:7px;
	width:93px;
	height:21px;
	display:block;
	text-decoration:none;
	color:black;
	float:right;
	margin-top:5px;
	overflow:hidden;	
	height:1%;
	}
	
#contenu #promo .c1{
	width:359px;
	height:11px;
	background:url('../images/promo-ht.jpg') no-repeat;
	}
	
#contenu #promo .c2{
	width:359px;
	height:11px;
	background:url('../images/promo-bas.jpg') no-repeat;
	}
	
	
/*=bloc promo2=*/
#contenu #promo2{
	font-size:12px;
	width:341px;
	margin-top:12px;
	/*margin-right:15px;*/
	position:absolute;	
	left:62%;
	top:45%;

	}
	
#contenu #promo2 h3{
	background:url('../images/promo2-ht.jpg') top no-repeat;
	text-align:center;
	padding-top:5px;
	width:341px;
	height:24px;
	}
#contenu #promo2 #texte{	
	background:#fff url('../images/promo2-bgk.jpg') repeat-x left bottom;
	border-left:#bdbdbd solid 1px;
	border-right:#bdbdbd solid 1px;	
	margin:0 0 0 0;
	padding: 0 9px 0 7px;
	min-height:100%;
	}
	
#contenu #promo2 #texte .lien{
	background:url('../images/btn-savoirplus.gif') no-repeat;
	font-size:11px;
	padding:2px 0 5px 7px;
	display:block;
	text-decoration:none;
	color:black;
	width:91px;
	height:21px;
	left:67%;
	position:relative;
	margin-top:5px;
	}
	
	
#contenu #promo2 #fdbas{
	background:url('../images/promo2-bas.jpg') no-repeat;
	width:341px;
	height:15px;
	}


et le code html :


<!--contenu-->
<div id="contenu">
<div class="photo">
<img src="images/photo/sol.jpg" width="749" height="218" />

<div id="realisation"><a href="#">Découvrez nos réalisations</a></div>
</div>
<div class="fil"><a href="index.php">accueil</a> > <a href="#">page1</a></div>
<br />
<h1>Titre</h1>
<br />
<p class="desrub">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque euismod, nibh in molestie iaculis, justo tortor dignissim nisi, vitae ornare leo ante faucibus turpis. Vestibulum consectetur mattis ligula. Aliquam pretium, est id porttitor ultricies, ipsum libero rutrum neque, ac eleifend magna lectus at lectus. Donec posuere, arcu eu condimentum lobortis, libero erat consequat mauris, vel congue eros nisl non tortor. Aliquam rhoncus. Nam augue dolor, tincidunt non, scelerisque eget, mattis eget, dui. Fusce sed justo sed felis bibendum hendrerit. Nulla nisl turpis, aliquet nec, imperdiet eu, sodales vel, nulla. Phasellus enim metus, feugiat vel, dignissim non, porttitor vel, massa. In orci. Aenean elit. Etiam accumsan varius lorem. </p>
</div>
</div>


Merci d'avance !
Modifié par luna6 (13 Mar 2009 - 09:32)
Sujet clos
Aller à