Как обернуть текст вдоль изображения?

-3

Как сделать это длинное слово (часть слова) появлением вдоль изображения в той же строке? Я пробовал:

<div style="width:200;background:#00FFFF;word-wrap:break-word;"> 
<img src="1.png">ThisIsAveryVeryVeryLongWordNextToTheImage 
</div>

источник

2016-04-26 rosemary

@Aziz почему вы изменили исходный код? –

Я сделал это фрагмент стека, в чем проблема? Это все равно одно и то же. – Aziz

@Aziz Вы добавили 'px' рядом с' 200'. Это аргумент, следующий ниже. Проверьте. –

Использование white-space: nowrap:

<div style="width:200px;background:#00FFFF;word-wrap:break-word;white-space: nowrap;"> 
    <img src="1.png">ThisIsAveryVeryVeryLongWordNextToTheImage 
</div>

использовать также width: 200px в width:200 недопустим в CSS.

Обновлено

<div style="width: 200px; background: #00FFFF; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;"> 
 
    <img src="//placehold.it/100x100" />ThisIsAveryVeryVeryLongWordNextToTheImage 
 
</div>

источник

2016-04-26 14:11:35

Спасибо, но это делает часть текста за пределами контейнера div, чего не ожидается. – rosemary

@rosemary Что-то вроде 'Long text text text tex ...' было бы лучше? –

У меня есть ваша точка зрения, но я хочу знать, есть ли слишком длинное слово, тогда какое решение будет. – rosemary

<div style="width:200;background:#00FFFF;word-wrap:break-word;word-break: break-all"> 
 
    <img src="1.png"> ThisIsAveryVeryVeryLongWordNextToTheImage 
 
</div>

источник

2016-04-26 14:25:44 rosemary

Недействительно. Значение 'width: 200' недопустимо. Проверьте мой ответ. –

У меня есть его друг, он должен быть шириной: 200 пикселей, но браузеры хорошо справляются с этим – rosemary

Chrome 50 (последний) на вашем коде: http://i.imgur.com/zj7CoIv.png Я уверен, что [CSS Spec] (https://developer.mozilla.org/en/docs/Web/CSS/width) говорит, что вам нужно **, чтобы положить 'px'. –

Как обернуть текст вдоль изображения?

ответ

Смежные вопросы