Wie man Text entlang eines Bildes wickelt?
Wie dieses lange Wort zu machen (ein Teil des Wortes) entlang des Bildes in der gleichen Zeile erscheinen? Ich habe versucht:
<div style="width:200;background:#00FFFF;word-wrap:break-word;">
<img src="1.png">ThisIsAveryVeryVeryLongWordNextToTheImage
</div>
Verwendung white-space: nowrap:
<div style="width:200px;background:#00FFFF;word-wrap:break-word;white-space: nowrap;">
<img src="1.png">ThisIsAveryVeryVeryLongWordNextToTheImage
</div>
auch verwenden width: 200px als width:200 in CSS ungültig ist.
Aktualisiert
<div style="width: 200px; background: #00FFFF; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;">
<img src="//placehold.it/100x100" />ThisIsAveryVeryVeryLongWordNextToTheImage
</div>Danke, aber dadurch wird ein Teil des Textes außerhalb des Container-Divs angezeigt, was nicht erwartet wird. – rosemary
@rosemary Etwas wie 'Langer Text Text Text tex ...' wäre besser? –
Ich habe Ihren Punkt, aber begierig zu wissen, ob es zu lange Wort ist, was wäre dann die Lösung. – rosemary
<div style="width:200;background:#00FFFF;word-wrap:break-word;word-break: break-all">
<img src="1.png"> ThisIsAveryVeryVeryLongWordNextToTheImage
</div>Dies ist nicht gültig. Die 'Breite: 200' ist ungültig. Überprüfe meine Antwort. –
Ich habe es Freund, sollte Breite sein: 200px, aber Browser gut mit diesem auch – rosemary
Chrome 50 (neueste) auf Ihrem Code: http://i.imgur.com/zj7CoIv.png Ich bin mir sicher [CSS Spec] (https://developer.mozilla.org/de/docs/Web/CSS/width) sagt, dass Sie ** brauchen **, um "px" zu setzen. –
@Aziz, warum Sie den ursprünglichen Code geändert haben? –
Ich habe es zu einem Stack-Snippet gemacht, was ist das Problem? Es ist immer noch das Gleiche, nur klarer. – Aziz
@Aziz Sie haben 'px' neben' 200' hinzugefügt Das ist das Argument, das unten geht. Prüfen. –