Для создания адаптивной и кроссбраузерной вёрстки на HTML и CSS рекомендуется следовать таким принципам:

1. Выбор подходящей методологии. 1 Например, методология BEM (Block, Element, Modifier) помогает структурировать CSS-код и делает его более понятным и удобным для дальнейшей поддержки. 1
2. Прогрессивное улучшение и отзывчивый дизайн. 1 Нужно создать базовую версию сайта, которая будет работать на всех устройствах и браузерах, а затем постепенно добавлять улучшения для более современных браузеров. 1
3. Использование медиа-запросов. 12 Они позволяют задавать стили для разных размеров экранов и устройств. 1 Обычно медиа-запросы пишут прямо в главном файле стилей. 2
4. Использование CSS-препроцессоров. 1 Например, Sass или Less позволяют использовать переменные, функции и миксины, что делает код более модульным, удобным для чтения и поддержки. 1
5. Тестирование в разных браузерах и на разных устройствах. 1 Это поможет обнаружить возможные проблемы и исправить их. 1 Для тестирования можно использовать инструменты, такие как BrowserStack или Sauce Labs. 1
6. Использование специфичных префиксов и полифилов. 1 Некоторые CSS свойства и JavaScript-функции могут не поддерживаться в старых версиях браузеров. 1 В этом случае нужно использовать специфичные префиксы (-webkit-, -moz-, -ms-, -o-) для CSS-свойств и полифилы для JavaScript-функций. 1

Также для кроссбраузерной вёрстки можно создать набор стилей (css reset), который сбрасывает настройки по умолчанию в веб-обозревателях. 2