Какое-то древнее дерьмо

Живёт тупо потому, что за хостинг уплачено на годы вперед

Записи в разделе 'HTML/CSS'

Семантическая верстка — советы и решения. Часть третья. Блочная модель

22 декабря 2007 · HTML/CSS, Рецептарий

Блочная модель

Одна из ключевых особенностей cемантической валидной верстки — использование правильной блочной модели. Рассмотрим на примере, как она работает.
Читать дальше →

Семантическая верстка — советы и решения. Часть вторая. Хаки-шмаки, даём люлей IE

7 декабря 2007 · HTML/CSS, Рецептарий

CSS-хаки

При использовании семантической верстки каждый разработчик обязательно столкнется с проблемами кроссбраузерности, для решения которых в большинстве случаев приходится использовать так называемые «хаки». Обычно под этим термином подразумевается особый способ написания селекторов или правил, понимаемый только конкретным браузером. Однако совместимость с CSS в большинстве браузеров уже достигла уровня, при котором следует ограничивать использование «хаков».

Как правило, основным источником неприятностей бывает Internet Explorer. Многообразие ошибок в реализации CSS в браузерах Microsoft удивляет даже самых опытных верстальщиков. В связи с этим возникают ситуации, когда необходимо использовать дополнительные или альтернативные правила для IE. Именно в таких случаях рекомендуется применять «хаки». Если же вам вдруг понадобились альтернативные правила, скажем, только для Firefox, то рекомендуется пересмотреть ваш код, и в 99% случаев вы найдете более элегантное решение.
Читать дальше →

Семантическая верстка — советы и решения. Часть первая. Капля теории, DTD и ластики

29 ноября 2007 · HTML/CSS, Рецептарий

Сегодня я начинаю публиковать по частям статью, написанную для русского издания PC Magazine, в которой рассказывается о приёмах семантической вёрстки. Первая часть: немного теории, DTD и ластики. Уровень — начинающие.

Вместо вступления

В последнее время все чаще требованием при разработке сайта становится бестабличная или «дивная» верстка. Оба термина стали чрезвычайно популярны, несмотря на то, что они в корне неверны.

Изначально, таблицы были выбраны дизайнерами и разработчиками для верстки по одной единственной причине — не существовало других средств реализации хоть сколько-нибудь сложных макетов. Со временем таблицы стали нормой и остаются ею до сих пор. Но мы уже не в девяностых и браузеры, которые значатся в наших технических заданиях, способны интерпретировать CSS на том уровне, который необходим для более корректной, структурированной и современной верстки.
Читать дальше →

IE 7, conditional comments и хаки

2 ноября 2006 · HTML/CSS, Рецептарий

В свете особенностей нового IE приходится править старые методы использования хаков.

Оптимальным вариантом для меня является подключение специфичного листа стилей для всех IE через conditional comments.

<!--[if IE]>...<![endif]-->

И использование классического сочетания «star html hack» и метода экранирования для старых IE, а также варианта без хаков для седьмого.

В результате в ie.css используются конструкции примерно следующего вида:

#element {
    zoom:1; /* IE 7 */
    }
    * HTML #element {
        height:auto; /* IE 5 */
        he\ight:1%; /* IE 6 */
        }

А у нас в квартире газ А какими методами пользуетесь Вы?

P.S. Пример с height:auto имеет абстрактный характер, height:1% для self clearing вполне достаточно.

Вертикальное выравнивание картинок

18 сентября 2006 · HTML/CSS, Рецептарий

Очень странно до сих пор наблюдать картинки, выравненные при помощи относительного позиционирования.

Не открою Америку, сказав, что для вертикального выравнивания картинки внутри, скажем, строки текста, существует известное всем css-свойство vertical-align.

Все гениальное просто:

img {
    vertical-align:middle;
    }

Строго говоря, у vertical-align есть весьма интересные значения. Не поленитесь заглянуть в спецификацию и попробовать на практике.