28220 sujets

CSS et mise en forme, CSS3

Div de droite qui passe à la ligne sous IE [résolu]

Bonjour,

Je suis sûr que le sujet a du être abordé des milliers de fois mais je voudrais avoir un eclaircissement que je n'ai pas trouvé dans les anciens messages.

Après avoir lu celui-ci, j'ai vu que la largeur du texte pouvait etre plus grande que la taille du conteneur. Pourquoi ?? Peux-ton y remedier.

Voici mon code (je cherche simplement à mettre 2 div alignés à gauche et à droite) :


CSS : 

#main {
	 position: relative;
	 margin: 0 auto;
	 width: 758px;
}

#main_contenu {
	 position: static;
	 width: auto;
	 display: block;
}

#centre {
	 position: relative;
	 width: 100%;
}

.centre_contenu {
	 overflow: hidden;
	 width: 100%;
	 display: block;
}

#col1 {
	 display:inline;
	 position: relative;
	 float:left;
	 min-height: 1px;
}

#col2 {
	 display:inline;
	 position: relative;
	 float:right;
	 min-height: 1px;
}

.col1_contenu, .col2_contenu {
	 display: block;
	 height: 100%;
}

HTML :

<div id="main">
<div id="main_contenu">

	<div id="centre">
	<div class="centre_contenu">

		<div id="col1">
		<div class="col1_contenu">

		Texte 1

		</div>
		</div>

		<div id="col2">
		<div class="col2_contenu">
		
		Texte 2
		
		</div>
		</div>

	</div>
	</div>

</div>
</div>


Bien sûr la ça marche vu que le texte n'est pas assez long. et c'est bien là le problème, c'est que des fois ca marche et des fois non... Smiley sweatdrop

Merci pour votre attention
Modifié par loloajax (26 Jan 2006 - 18:37)
Bonjour,

Merci de mettre un exemple en ligne, en plus du code affiché dans ton message. Je ne sais pas pour les autres, mais je me rend mieux compte en voyant de visu comme qui dirait Smiley cligne Utilisant l'extension webdeveloper je peux faire quelques modifs à la volée pour tester… Merci
loloajax a écrit :
J'ai vu que la largeur du texte pouvait etre plus grande que la taille du conteneur. Pourquoi ?? Peux-ton y remedier.

C'est un peu vague comme question :
Quelle largeur de texte ? La largeur des caractères, ou bien d'une div qui contient du texte, ou de paragraphes... ?
Quel conteneur ? Le conteneur direct du texte (balise <p> par exemple), le conteneur dans lequel on place des paragraphes (une <div>), un conteneur global qui englobe toute la page ?

J'ai fait un test avec ton code et plus de texte, je ne vois pas trop le problème.
Sinon, toujours à partir de ton code, j'ai fait cette page :
http://web.covertprestige.info/test/02-deux-colonnes-simples.html

On retrouve bien les deux colonnes et la page avec une <div> globale, mais si tu regardes le code (CSS ou HTML) tu verras qu'il est très fortement simplifié.
Ton code était bourré de choses pas très utiles il me semble, comme des height: 100%; (si l'élément parent n'a pas de hauteur fixe, cette propriété n'est pas prise en compte), des position: static; (c'est la valeur par défaut, pas besoin de la préciser) ou des position: relative qui ne servaient à rien.
Merci à vous de vous être pencher sur le sujet.

C'est vrai qu'il y a sûrement beacoupde choses inutiles dans la CSS, mais je suis novice...

Après avoir cherché un peu partout sur le net, j'ai trouvé la solution à mon problème : un "overflow: hidden" suffisait dans la col2.
Plus de précisions ici

Encore merci.
A+
Sujet clos
Aller à