Hoe kan ik een afbeelding rechts uitlijnen met CSS.
Ik wil nietdat de tekst wrap-around
. Ik wil dat de rechts uitgelijnde afbeelding op zichzelf op een lijn staat.
Antwoord 1, autoriteit 100%
<img style="float: right;" alt="" src="https://example.com/image.png" />
<div style="clear: right">
...text...
</div>
Antwoord 2, autoriteit 16%
Laat de afbeelding naar rechts zweven, waardoor eerstuw tekst eromheen loopt.
Wat dan ook het volgendeelement is, zet het op { clear: right; } en alles stopt met rond de afbeelding te wikkelen.
Antwoord 3, autoriteit 11%
Er zijn een paar verschillende manieren om dit te doen, maar het volgende is een kort voorbeeld van een manier.
<img src="yourimage.jpg" style="float:right" /><div style="clear:both">Your text here.</div>
Ik heb inline stijlen gebruikt voor dit voorbeeld, maar je kunt deze gemakkelijk in een stylesheet plaatsen en verwijzen naar de klasse of id.
Antwoord 4, autoriteit 5%
Om de afbeelding naar rechts te laten bewegen:
float: right;
Om de tekst niet omwikkeld te maken:
clear: right;
Voor de beste werkwijze plaatst u de css-code in uw stylesheets-bestand. Zodra u meer code toevoegt, ziet het er rommelig uit en is het moeilijk te bewerken.
Antwoord 5, autoriteit 2%
Mijn oplossing voor dit probleem was om display: inline
in te stellen op het afbeeldingselement.
Hiermee worden uw afbeelding en tekst opgesteld aan de rechterkant als u text-align: right
van een oudercontainer.
Antwoord 6, Autoriteit 2%
img {
display: block;
margin-left: auto;
}