Forum > XHTML / CSS > Float : left sans mettre le texte dessous

Float : left sans mettre le texte dessous

ok Le problème posé sur ce sujet a été résolu.
avatar de stc
Membre
# Le 17/03/2009 à 13h55
Salut ça doit sûrement être tout con mais j'ai un petit problème de design. J'utilise un <div> en float left pour un menu vertical qui se présente sous forme d'une colonne et à droite de cette colonne j'ai un contenu de longueur variable (suivant la page). Le problème (qui est esthétique en fait) est que le contenu se pose bien a droite mais quand sa hauteur dépasse celle de la colonne le reste du contenu se met sous la colonne. Moi j'aimerais que le texte ne se mette pas dessous mais continu a être aligné. J'aimerais éviter d'utiliser les tableaux.
Tchao
Merci
avatar de Tony_
Administrateur
# Le 17/03/2009 à 15h35
Bonjour stc,
normalement il y a plusieurs solutions pour faire ca.
Si ton menu de gauche a une largeur fixe, c'est a dire que la largeur n'est pas en pourcentage, alors il suffit de mettre en margin-left a ton div de droite.
Exemple: si ton menu de gauche fait 200px il faut que tu mette au contenu de droite une marge-gauche au minimum de 200px. Après il ne reste qu'à toi de personnaliser. smiley

Et si ton menu de gauche a une taille variable (en pourcentage), il te suffit de faire flotter a droite le contenu de droite et de gérer de façon a ce que les deux contenus ne se touchent jamais.

Cordialement. smiley
N'hésitez pas à consulter le dossier référencement. smiley
Sinon hors internet je suis développeur web PHP.
avatar de stc
Membre
# Le 17/03/2009 à 15h58
Merci! J'aime pas trop ça mais j'ai opté pour le margin et le menu a largeur fixe. En fait, c'est surtout que le float:right; ne marchais pas trop (ma page était toute décalé a droite de l'écran).
Merci encore tchao
avatar de Tony_
Administrateur
# Le 18/03/2009 à 15h20
J'y pense que maintenant, mais en fait il y a une autre solution possible lorsque le menu de gauche a une taille variable, il faut faire un margin-left avec un pourcentage. Ainsi la marge va s'adapter a la largeur de l'écran tout autant que le menu de gauche. smiley

Cordialement.
N'hésitez pas à consulter le dossier référencement. smiley
Sinon hors internet je suis développeur web PHP.
avatar de stc
Membre
# Le 18/03/2009 à 15h48
En effet funnycat! Ça marche, je vais mettre le code ça pourra toujours servir:
Code:
.column_left {
	height: 100%;
	margin-top: 10px;
	margin-right: 10px;
	width: 10%;
	float: left;
}
.content {
	margin-left: 10%;
}

Code:
<div class="column_left">
....
</div>
<div class="content">
....
</div>

Voila merci encore!