<rmcreative>

RSS

Все заметки с тегом «float»

Можно уточнить:

    (5)
  1. (1)
  2. (10)
    (1)
  1. Сложное обтекание текстом

    26 января 2011

    Иногда, особенно при оформлении промо-страничек, так и хочется сдалать «журнальную» обложку с текстом заметки, который обтекает иллюстрацию. Многие верстальщики, видя такое, сразу говорят, что это невозможно. Однако, немного подумав, сверстать «как в журнале» можно.

    Если картинка квадратная, то решается наша задача довольно просто. Свойство float с соответствующим значением left или right вполне решает нашу проблему. Но что же нам делать с яблоком?!

    На самом деле наше яблоко почти ничем не отличается от квадратного… разве что квадрат получается не один.

    Текст будет идти в две колонки, поэтому мы делим яблоко на две части. Далее сверху вниз у нас выходят отступы с разной шириной. На каждый из таких отступов заводим отдельный элемент div. Сразу после блоков- отступов размещаем текст.

    Для лучшего понимания можно навести мышь на яблоко и посмотреть код.

    23 комментария
  2. clearfix vs overflow. Недостатки и достоинства

    6 января 2009

    Ответ на предыдущую статью об очистке потока.

    Я бы хотел остановиться подробнее на достоинствах и недостатках этих двух решений. Лично я в своей работе применяю и тот, и другой способ. Причиной тому простой факт: каждый из них имеет свои сильные и слабые стороны, которые приходится учитывать при верстке. Ибо на практике, overflow не всегда уместен, а clearfix не так бесполезен, как кажется.

    Читаем

    2 комментария
  3. Запрет на обтекание float’ов

    21 сентября 2008

    http://dimox.name/wp-content/uploads/image_positioning3.png

    Несколько способов достичь подобной картинки: текст имеет одинаковый отступ.

    Решение Дмитрия Лялина

    Решение Gordi

    Решение Алексея Рыбакова

    Решение Юрия Артюха

    11 комментариев
  4. Убираем лесенку у float-ов

    7 сентября 2008

    http://cssing.org.ua/pic/floatmess/2.png

    Юрий Артюх порадовал несколькими элегантными решениями довольно гадкой и часто встречающейся проблемы типа «лесенка у float-элементов».

    Рекомендую

    Комментировать
  5. Боремся с двойным отступом в IE6 при использовании float

    9 июня 2008

    Отличный трюк, позволяющий избежать удваивания отступа в IE6 при использовании float.

    Пробуем

    Комментировать
  6. Clear для плавающих блоков

    21 апреля 2008

    Свежий перевод довольно древней, но интересной статьи и не менее интересные комментарии.

    Читаем

    На самом деле назван перевод как «Клиринг плавающих блоков», но я такое название просто не смог переварить…

    2 комментария
  7. Различные способы применения CSS-свойства clear к float-блокам без использования дополнительной разметки

    30 января 2008

    Данная заметка является переводом.

    Оригинал: Роберт Ньюман, http://www.robertnyman.com/

    Используя CSS-свойство float вы наверняка сталкивались с весьма интересным его влиянием на последующее содержимое страницы. В этой заметке я расскажу вам, как применить свойство clear к float-блокам без использования какой-либо дополнительной разметки.

    Читаем

    5 комментариев
  8. Clearfix: три способа

    21 ноября 2007

    О том, как устранить выпадание блоков с float из родительского контейнера.

    Читаем

    2 комментария
  9. CSS Float в теории и на практике

    6 июля 2007

    Отличный перевод от проекта Design For Masters.

    1 комментарий
  10. float, position и display

    5 июня 2007

    Познавательная статья про свойства CSS float, position и display.

    Рекомендую

    Комментировать