Положение текста внутри строки

Question

Положение текста внутри строки

Это живая демонстрация: http://jsfiddle.net/9Y7Cm/5/

С этим все в порядке, пока ширина текста там не будет больше ширины div.

Если вы добавите туда какой-то текст, строка оборвется, и текст будет отображаться под изображением, а не рядом с изображением (как вы можете видеть в моей первой скрипке).

Здесь вы можете увидеть, что происходит, его ширина текста превышает ширину контейнера div:

http://jsfiddle.net/9Y7Cm/12/

Есть ли способ это исправить?

-1

css text position

Источник

user989749 12 фев '12 в 16:10

3 ответа

Решение

Просто удали display:inline-block; из CSS для span элемент ( пример jsFiddle).

Больше информации о display:inline-block,

inline-block: Это значение заставляет элемент генерировать контейнерный блок встроенного уровня. Внутренняя часть встроенного блока отформатирована как блок блока, а сам элемент отформатирован как атомарный блок на уровне строки.

1

Источник

user596247 12 фев '12 в 16:24

Проблема с display:inline-block на протяжении Удалите его, и текст будет в той же строке

0

Источник

user137483 12 фев '12 в 16:15

Другие вопросы по тегам css text position

user680398 12 фев '12 в 16:24 2012-02-12 16:24 · Accepted Answer · 2012-02-12 16:24

Присвойте правому содержимому ширину и поместите его вправо, вот так:

http://jsfiddle.net/9Y7Cm/14/

Для более чистого результата я предлагаю вам разделить обе стороны вашего контента - левую и правую - классом и шириной, а затем разместить их так, чтобы они располагались рядом.