28220 sujets

CSS et mise en forme, CSS3

[Résolu]Aligner horizontalement une image et un bloc de texte

Salut à tous,

je suis honteux de poster une requête aussi basique, mais
je n'arrive pas à faire ceci:

http://jsvega.free.fr/revmet14.htm

Je voudrais tout simplement, sur la même ligne, une image
à gauche, et un bloc de texte à droite. C'est tellement bête que je
n'y arrive pas...j'ai consulté la FAQ, et la propriété vertical-align,
mais mon bloc de texte étant balisé par des "hn", le texte se place
dessous. Bref, pagaille...

Une précision: je voudrais également que cette mise en page
"image à gauche, texte à droite" puisse se répéter dans la même page,
comme ici:

http://jsvega.free.fr/boite11.htm

Merci d'avance.
Modifié par bouquins (07 Jun 2005 - 16:20)
Attends, à la réflexion, j'avais mis aussi un float: right sur le texte...pas bon ça!??
Modifié par bouquins (07 Jun 2005 - 10:30)
Administrateur
bouquins a écrit :
Salut,

le problème, c'est qu'avec le float, je n'ai plus la couleur de fond du conteneur...

Je ne comprends pas. Le body garde toujours sa couleur de fond.

C'est bien cet exemple que tu veux réaliser : http://jsvega.free.fr/revmet14.htm ?

Sinon il faudrait être plus précis ou montrer exactement ce que tu veux.

PS : si tu as un problème de débordement avec les floats : http://forum.alsacreations.com/faq/#item6 Smiley cligne

a écrit :
Attends, à la réflexion, j'avais mis aussi un float: right sur le texte...pas bon ça!??

Non, c'est inutile. Il sera de toute façon à droite de l'élément en float left.
Modifié par Raphael (07 Jun 2005 - 10:32)
a écrit :
Eh bien c'est pas mal, non ? C'est ce que tu voulais obtenir ?


Oui, ça me convient!! Le seul souci, c'est que si le texte est moins long, ou bine si l'on réduit la taille des caractères, l'image en float "déborde"; donc si j'ai bien suivi, je place un pied avec "clear: both;", et ça devrait aller.

J'y retourne!!
Dès que c'est résolu, je l'indique; je te remercie bien!!
Désolé de faire un up...

Voici l'adresse:

http://jsvega.free.fr/test/revmetal1.html

Je voudrais que quelle que soit la hauteur de la photo à droite, le conteneur surligné de jaune s'adapte et l'englobe. Or ceci ne fonctionne (selon mes maigres connaissances...) que si je donne une hauteur définie à ce conteneur. Les "height=100%" et autres "height: auto;" ne semblent pas convenir.

Merci d'avance!
Administrateur
Tu dois mettre le <hr /> (clear) dans ton conteneur à bord jaune.
Ainsi le <hr /> sera toujours en bas du conteneur et le "poussera" au besoin.
Sujet clos
Aller à