aligner à droite une image en utilisant CSS HTML

Comment puis-je aligner à droite une image en utilisant CSS.

Je ne veux pas que le texte wrap-around l'image. Je veux que la bonne image alignée soit sur une ligne par elle-même.

25
demandé sur unixman83 2011-03-07 04:32:21

4 réponses

<img style="float: right;" alt="" src="http://example.com/image.png" />
<div style="clear: right">
   ...text...
</div>    

JsFiddle.

47
répondu alex 2011-03-07 01:50:35

Flotter l'image à droite, ce qui au début provoque votre texte à enrouler autour d'elle.

Alors quel que soit l'élément suivant, Définissez-le sur { clear: right;} et tout cessera de s'enrouler autour de l'image.

12
répondu jeffszusz 2011-03-07 01:43:36

Il y a plusieurs façons de le faire, Mais voici un exemple rapide d'une façon.

<img src="yourimage.jpg" style="float:right" /><div style="clear:both">Your text here.</div>

J'ai utilisé des styles en ligne pour cet exemple, mais vous pouvez facilement les placer dans une feuille de style et référencer la classe ou l'id.

5
répondu Misty Lackie 2011-03-07 01:43:30

Pour faire bouger l'image vers la droite:

float: right;

Pour que le texte ne soit pas enveloppé:

clear: right;

Pour les meilleures pratiques, placez le code css dans votre fichier de feuilles de style. Une fois que vous ajoutez plus de code, il aura l'air désordonné et difficile à modifier.

1
répondu Sweet_Cherry 2017-12-21 22:08:47