Aide sur un détail CSS

Bonjour,

j'ai un soucis que je n'arrive pas à résoudre. Je crains que pour vous ça soit enfantin, mais moi je n'y arrive pas.

Mon soucis est visible ici: http://gauchiste-contrariant.vikchill.com/index.php?

En bas à gauche, il y a "Sur les réseaux". Vous verrez tout de suite que les éléments se superposent et deviennent illisibles. Idéalement, je voulais mettre ce qui est à gauche au dessus de ce qui est à droite, pour que ça soit plus conventionnel. Sans succès.

J'ai donc essayé de corriger sans changer la disposition, mais à part un float right pour séparer les deux éléments, rien de satisfaisant, ça devient plus lisible mais les colonnes restent trop étroites.

Merci pour votre aide et votre indulgence.

Salut,

Tu as donné un width de 18% à tes deux div. Elles manquent seulement de place et les mots longs dépassent.

Agrandie tes divs, ou utilise word-wrap pour forcer la césure des mots trop long.

J'ai remis le "float: right" et ajouté le word-wrap, mais c'est insuffisant. Il faudrait effectivement élargir ces deux colonnes, mais je ne sais pas où agir dans les css.

Utilise Firebug, et tu en auras pour quelques secondes à débugguer ton souci.

Tu as un Width:18% imposé sur les DIV.
Ton sélecteur est mauvais. Enfin, regarde avec Firebug...

Merci pour Firebug, je ne connaissais pas et il vient de mettre un joli fatality à WebDevelopper.

Effectivement, j'y vois plus clair: #blogextra div a une largueur de 18%. Je souhaiterais garder cette largeur pour le div. Si j'ai bien saisi, le soucis c'est qu'à l'intérieur de ce même div, les autres div héritent de ces 18%.

Ainsi, si j'enlève ces fameux 18% des div, je peux mettre 40% à .social-reader div et un float: right à .record-content, par exemple. Mais ça me fous en l'air la disposition du template dotclear... Comment conciciler les deux?

Bref, j'y vois plus clair, mais j'ai pas encore la solution...