Возможно, вы захотите инкапсулировать свой CSS в более формальную CSS-среду. Вы можете создать свой собственный фреймворк, но есть некоторые полезные css-фреймворки с открытым исходным кодом, такие как yuhoo's YUI и Blue Print CSS
http://www.blueprintcss.org/
Приятной особенностью этого подхода является то, что он использует много усилий для устранения проблем, связанных с кроссбраузерными шрифтами и макетом.
В зависимости от того, как далеко вы зайдете, вам, возможно, придется сильно коснуться существующей разметки. В зависимости от того, насколько велик ваш сайт, я постараюсь постепенно корректировать стили и переносить их в формальную структуру CSS. В долгосрочной перспективе это сделает CSS более управляемым и легким для понимания другими разработчиками, знакомыми с концепцией фреймворка.
Постепенно пытайтесь устранить избыточные и неучтенные стили.
Я бы также создал файл debug.css. Возьмите все имена старых стилей и добавьте к ним стиль идентификации. Например:
.myoldstyle {border: solid 1px red};
Затем вы можете определить, где по всему сайту используется старый стиль. Каждый стиль должен быть учтен и перенесен на новую систему. Когда определенный стиль в старой системе был правильно перенесен в новую систему, вы можете удалить (или лучше закомментировать) стиль идентификации из файла debug.css. Вы можете быть уверены, что перенесли все стили, когда debug.css не показывает никаких побочных эффектов при выводе на экран.
Это может быть трудоемким процессом, но систематический подход может быть полезным.
Кроме того, вы можете начать смотреть на свой сайт без CSS вообще. Просто получите представление о логической и семантической разметке кода. Наличие чистой базы HTML-кода помогает при отладке причуд стиля.
Что касается организации CSS, я хотел бы разделить на основные категории: верстка, типография, lookandfeel, навигация
Храните всю информацию о цвете в таблице стилей lookandfeel. Именно здесь вы будете проводить больше всего времени, пытаясь удовлетворить визуальные вкусы и желания клиента. Удобно, чтобы это была отдельная логическая таблица стилей. Другие вещи более функциональны и стандартизированы. Наличие этой абстракции значительно упрощает изоляцию визуальных эффектов стилей.
И последний совет, проверьте плагин Firefox Firebug или отладчик Safari. Они могут показать вам вычисленные стили (способ, которым стили и элементы в конечном итоге выводятся при применении различных стилей), и вы можете настраивать конкретные стили в реальном времени на лету, если вы хотите исследовать эффекты конкретного изменения стиля в сложном CSS система.
И самое главное, держите отдельный файл ie.css. Это должна быть последняя таблица стилей, указанная в ваших заголовках. Если вам нужно сделать какие-либо обходные пути для IE, поместите их здесь. И выставлять эту таблицу стилей в IE только через условные комментарии.
http://www.quirksmode.org/css/condcom.html
Это самый быстрый способ решения проблем IE 6.