Центрирование изображения в абзаце

Question

Я ищу чисто CSS способ центрирования изображения внутри абзаца текста, чтобы текст обернулся с обеих сторон изображения.

Ideely the image  |-----| would be placed
before or after   |-img-| the text within
the code structure|-----| and the text 
would wrap around the image.

Answer 1

Нашли ответ, который работает достаточно хорошо, по адресу: http://www.alistapart.com/articles/crosscolumn/

Answer 2

Предпросмотр IE10 Platform предположительно (в соответствии с этой статьей ) имеет новую функцию под названием позиционные поплавки , которая, кажется, выполняет то, что вы ищете.теперь, я думаю, ты облажался: /

Answer 3

Я не думаю, что это возможно:

<p> Text that goes here and image <img src="img.jpg"/> continues text</p>

Насколько я знаю, браузеры обрабатывают <p> контент как принадлежащий строке, поэтому, когда браузер анализирует ваш p-тег, содержащий изображение, он автоматически сделает эту строку такой же высокой, как и изображение.

Возможно, это возможно с помощью css3 ...

Answer 4

В настоящее время нет способа сделать это.Я смотрел далеко и широко.

Другие ответы здесь не обращаются к вопросу, поскольку он задается. Эта ссылка (A List Apart) требует использования двух абзацев текста, и вы не можете сделать это динамически, потому что вы должны быть осторожны, чтобы сопоставить текст с обеих сторон изображения.

Другой, позиционируемые плавающие элементы IE10 (Microsoft называет их исключениями ), выполняет какую-то работу, но со списком предостережений:

• Это только IE.
• Вы должны указать такие вещи, как количество столбцов, а не смещение.
• Это не очень хорошо работает при изменении размера окна.Другое содержимое перекрывается, и контейнер поддерживает минимальный размер.