Обтекание не квадратной картинки текстом. Как?

Тема в разделе "Верстка", создана пользователем igumenov, 25 сен 2014.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. igumenov

    igumenov

    Регистр.:
    30 июн 2009
    Сообщения:
    262
    Симпатии:
    100
    Столкнулся с такой бедой, как умно сделать умно такое обтекание? Похожее было на сайте Лебедева в заданиях, но решения не нашел
    (2е задание)

    Вот собственно и мой пример
    https://yadi.sk/i/6yKWNH_GbfNoX
     
  2. latteo

    latteo Эффективное использование PHP, MySQL

    Moderator
    Регистр.:
    28 фев 2008
    Сообщения:
    1.401
    Симпатии:
    1.182
    Картинка в любом случае будет имеет прямоугольные границы. Для обтекания текстом делайте текст в более высоком слое, который наезжает на картинку, с кастомными (вручную заданными) отступами текста слева для каждого ряда слов, если жёсткая сетка.

    Либо поверх картинки создайте слои (<div>) с фиксированной шириной, на которые не сможет наехать ваш текст - для резиновой вёрстки.

    PS: сорри, но в коде я это не покажу.
     
  3. funnywheel

    funnywheel

    Регистр.:
    6 авг 2010
    Сообщения:
    176
    Симпатии:
    109
    Пробовал следовать замыслу latteo на хтмл+ксс, не победил задачу. Зато нашел такие возможности в беконе http://baconforme.com/
     
    vlasenkov нравится это.
  4. igumenov

    igumenov

    Регистр.:
    30 июн 2009
    Сообщения:
    262
    Симпатии:
    100
  5. Hannibal86

    Hannibal86 Создатель

    Регистр.:
    17 сен 2014
    Сообщения:
    37
    Симпатии:
    17
    Это решение для жестко зафиксированного изображения и текста. И по моему это едниственно правильное решение

    Я как-то сомневаюсь в кроссбрузерности этого решения. Особенно Сафари и Опера. И учтите что это решение работает только благодаря яваскрипту - нужны ли вам дополнительные библиотеки в коде? Было бы проще если бы вы поставили конкретную задачу
     
  6. smerlol

    smerlol Создатель

    Регистр.:
    31 авг 2014
    Сообщения:
    26
    Симпатии:
    8
    В опере работает, в сафари тоже. Ну в общем-то, да, это ненужная приблуда/
     
    Hannibal86 нравится это.
  7. maksimnels2

    maksimnels2 Писатель

    Регистр.:
    28 сен 2014
    Сообщения:
    1
    Симпатии:
    0
    интересный вариант, но кроме как двуслойности не вижу другого варианта