28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un petit problème, qui parait super simple, mais j'ai passé mon après midi dessus sans lui trouver de solution. Je m'en remet donc a vous avant de violenter mon clavier ^^

J'ai besoin pour la mise en forme de ma page de deux colonnes cote à cote.
Le souci vient du fait que la 1ere colonne est sensée prendre la largeur de son contenu (une image), et la seconde colonne doit prendre la place restante.
Et pour je ne sais quelle raison, je ne parviens pas à mes fins... Le texte présent dans la deuxième colonne l'étire jusque à ce qu'elle passe en dessous de la 1ere colonne, prenant ainsi tout la largeur de ma page.

J'espère avoir été clair, et je vous remercie d'avance pour vos idées =)

Edit : Mes deux <div> sont en float: left;. Le comble c'est qu'avec IE 7 ça marche !!!
Modifié par Melkor (03 Apr 2009 - 17:35)
Hello,

Une <div> sans largeur fixée prend par défaut 100% de la largeur de son parent (sauf en cas de positionnement absolu). D'où les superpositions de tes colonnes.

Tu n'arriveras pas à obtenir un tel comportement (colonne fluide "super-intelligente" sans largeur) naturellement.

Quelques idées :
- Revoir ta mise en page et fixer des largeurs (pixel ou pourcentage),
- Laisser la colonne de gauche flottante, celle de droite dans le flux + du Javascript pour fixer la largeur des deux colonnes ET du margin-left de la colonne de droite,

Melkor a écrit :
Le comble c'est qu'avec IE 7 ça marche !!!
Ça je me demande encore comment...
Modifié par BeliG (06 Apr 2009 - 10:58)
Bon bon bon, c'est bien dommage d'être obligé d'utiliser JS pour faire ça, je pensais pouvoir m'en affranchir... M'enfin si c'est la seule solution...

Merci pour ta réponse BeliG, pi si entre temps quelqu'un a mieux à me proposer je suis toujours à l'écoute. ^^