Texte toujours au meme alignement

24 janv. 2007, 10:43

Bonjour,

J'ai un probleme de CSS auquel je ne trouve pas de solution. Je vous montre comment ma page est agencée pour que vous puissiez voir l ordre des balises :

Code : Tout sélectionner

<body>
<div id="container" >
	<div id="header"></div>
	<div id="outer" >
 	<div id="inner">
 	<div id="menu"></div>
                <div id="content"></div>
	</div>
	</div>
 	<div id="footer"></div>
</div>
</body>

Mon probleme en fait se situe au niveau du texte dans le div "content". Tant que le div menu contient quelque chose alors le texte dans content est a la droite du menu, mais des que le menu s arrete le texte dans content revient au début (la ou menu commencait...). Cela me semble logique mais je ne sais pas comment faire pour le texte dans menu soit toujours aligné... Soit il faudrait que le bloc menu fasse la meme taille que le bloc content quoiqu'il arrive, soit il faudrait que le texte dans content soit toujours a la meme position et j avoue que je ne sais pas comment faire... Ci-apres les blocs css qui a mon avis posent probleme.

Merci d avance.

Code : Tout sélectionner

#container {
width: 750px;
padding:0px;
margin: 0px;
margin-left: auto;
margin-right: auto;
} 

#outer{ 
margin:0px;
border-left: solid 5px #9966cb;
border-right: solid 5px #9966cb;
background-color: #FFFFFF; 
} 

#inner{
          margin:0; width:100%; 
          } 

#menu {
 background-color:FFFFFF;
 width:180px; 
 float:left; 
 position:relative; 
 margin-left:-5px; 
 margin-right:1px;
 margin-top:0px;
 background-image:url(images/layout/left.jpg);
 background-repeat:repeat-y;
 }

#content{ 
position: relative; 
margin: 0px; 
}

24 janv. 2007, 12:08

Tu as le problème avec tous les navigateurs ou juste sur IE?

24 janv. 2007, 12:14

IE et FF... Mais en fait c'est pas une erreur ca me parait logique quand quand le bloc menu se termine le bloc content commence au début du container... Je ne sais juste pas comment faire pour éviter ca...

25 janv. 2007, 19:11

il vaudrai mieux que tu donne le lien de ta page, et de toute façon tu as trop de redondance, commence par styler la structure, puis les artifices. Sa te permettra d'éliminer les errreurs.
Un div n'à pas de marge si tu n'en met pas, sa clarifie déjà un peu plus ton code

Code : Tout sélectionner

<style>
html body{padding:0px;margin: 0px;}
#container {width: 750px;}

#outer{
border-left: solid 5px #9966cb;border-right: solid 5px #9966cb;
background-color: #FFF;
}

#inner{width:100%;}

#menu {background-color:FFF;width:180px;float:left;position:relative;margin-left:-5px; margin-right:1px;margin-top:0px;background-image:url(images/layout/left.jpg);background-repeat:repeat-y;}

#content{position: relative;margin:0px;
}
</style>

Code : Tout sélectionner

<div id="container">
	<div id="header"></div>
	<div id="outer" >
		<div id="inner">
			<div id="menu">ffddffdff</div>
			<div id="content"></div>
		</div>
	</div>
	<div id="footer"></div>
</div>

Texte toujours au meme alignement

Qui est en ligne