Исследование высоты BODY

Обложка к записи Исследование высоты BODY

Небольшое исследование поведения элемента BODY в различных браузерах. Отступы от границ окна (margin, padding). Высота BODY и ее изменение в зависимости от высоты контента в Internet Explorer 6, Firefox 1.5, Opera 8. Внимание: это очень старый, но актуальный пост, оставлю его здесь в честь памяти сайту html.ru, который более не доступен. Для исследования возьму минимальный XHTML-документ: …

ПодробнееИсследование высоты BODY

Верстка табов с помощью

Обложка к записи Верстка табов с помощью

Когда-то возникла необходимость сделать табы на странице. Это довольно типовая задача, поэтому, чтобы не изобретать велосипед, полез в Гугл посмотреть, как народ делает.

Эмуляция position: fixed в Internet Explorer 6

Internet Explorer 6 не поддерживает CSS-свойство position: fixed, поэтому для эмуляции данного эффекта используют position: absolute и CSS expression. Однако, в результате при скроллинге или изменении размеров окна браузера возникали небольшие подёргивания фиксированного блока. Баг возникает из-за того, что IE рендерит страницу в несколько этапов, обрабатывая CSS в последнюю очередь

Адаптивный веб-дизайн: bookmarklet

Отзывчивый веб-дизайн (Responsive Web Design или сокращенно RWD) имеет ряд преимуществ перед обычным дизайном:

  • Сайт одинаково хорошо выглядит практически на любом устройстве при любом разрешении экрана и любой ориентации дисплея;
  • Одна верстка вместо нескольких вариантов сайта под разные устройства (Mobile, PDA, iPone, iPad);
  • Это простая и веселая технология — все крутые парни используют ее.

В то время как отзывчивый веб-дизайн становится всё популярнее, инструментов для помощи разработчикам больше не становится. Многие из них похожи на утилиту Мэтта Керсли, которая показывает одну и ту же страницу во фреймах различного размера. Это полезно только для «живых» сайтов, которые уже есть в интернете, а что делать, если вы ведете разработку локально?

Адаптивный веб-дизайн: эмуляторы мобильных устройств

Адаптивный веб-дизайн (англ. Responsive web design, дословно отзывчивый веб-дизайн) — технология создания веб-страниц, удобно просматриваемых с различных устройств, с которых есть возможность выхода в интернет

Прежде чем начать верстать адаптивные макеты, вам необходимо позаботиться о возможности тестирования вашего творения.

TTF шрифты на веб-странице

Хотите использовать не стандартный шрифт на вашей веб-странице? Уже сейчас многие браузеры способны отображать TTF-шрифты, используя только CSS: последние версии Firefox, Opera, IE6, IE7, IE8 и Safari (Mac).

Пуленепробиваемые iOS медиа-выражения перевод

Благодаря работе, проделанной компанией Apple, пользователи имеют превосходные интерфейсы, а разработчики экономят кучу времени, так как абсолютно любое устройство можно отличить от другого по Media Queries, тем самым создавая по-настоящему отзывчивые сайты.

Вложенные ссылки в HTML

Как известно, в спецификации HTML чётко указано, что вложенных ссылок нет и быть не может. Но, буквально на днях, Роман Комаров (разработчик интерфейсов в Яндексе) предложил поистине простой и вполне рабочий вариант решения данной проблемы.

«Дедовский» способ кастомизации чекбоксов и радиокнопок на CSS

Теме кастомизации стандартных контроллов (радиокнопок и чекбоксов) посвящено огромное количество статей, но все они сводятся к подключению ненужных jQuery-плагинов, роль которых — полная замена нативных checkbox и radio на смесь непонятных структур HTML и JavaScript.