Краткое содержание

Задача: воспроизвести с помощью CSS основную страницу WebReference. Инструменты: CSS и много свободного времени.

Kwon Ekstrom предложил свою CSS версию главной страницы WebReference. Rogelio Lizaolo улучшил ее. Через несколько месяцев напряженной совместной работы финальный вариант на CSS полностью повторял прежний, табличный. В процессе мы обнаружили массу ошибок в NN и IE и нашли несколько элегантных уловок для их обхода. Ниже следует наша пошаговая инструкция, с помощью которой вы можете повторить наш подвиг.
Вступление
В статье Эволюция домашней странички Andy King бросил вызов читателям, предложив им воспроизвести табличную верстку WebRef с помощью CSS. Kwon Ekstrom предложил решение, которое работало, но только в ограниченном наборе броузеров. После исследования его проекта я нашел в нем некоторые несообразности, которые попытался решить. Несколько месяцев Andy, Kwon и я не покладая рук трудились над дизайном WebRef.

Основной нашей целью было создать CSS разметку, которая бы полностью повторяла табличный дизайн WebReference.com, и прилично бы выглядела при любых размерах окна и шрифта.

Работа велась с прицелом на пятое поколение броузеров, в качестве платформы предполагались Windows и Macintosh. Мы намеревались использовать одни и те же стилевые таблицы для всех броузеров. Это ограничение усложнило нашу задачу, и сделало финальный код куда сложнее и запутаннее, чем если бы мы ориентировались только на броузеры с корректной поддержкой CSS-2 (например, Netscape 6). Понятно, что из-за проблем с совместимостью мы не могли использовать весь спектр возможностей CSS.

Продолжение читать здесь