Фиксированная вёрстка задаёт размеры блоков в жёстких единицах вроде пикселей и рассчитана на конкретную ширину экрана. Резиновая, или флюидная, вёрстка использует относительные единицы — проценты, доли вьюпорта, дробные значения Grid — и подстраивается под доступное пространство динамически.
Много лет назад, когда разброс размеров экранов был не так велик, фиксированная вёрстка под стандартную ширину монитора была вполне рабочим решением. Сегодня, когда один и тот же сайт открывают и на компактном телефоне, и на огромном мониторе, чисто фиксированный подход почти не встречается в современных проектах.
При этом полностью резиновая вёрстка без единого ограничения тоже не всегда хороша — текстовый блок, растянутый на всю ширину огромного монитора, читать неудобно из-за слишком длинных строк. Поэтому на практике почти всегда используют гибрид: резиновые блоки с ограничением максимальной ширины через max-width.
Изображения в резиновой вёрстке обычно получают width 100% и height auto — это позволяет картинке сжиматься вместе с родительским контейнером, сохраняя пропорции, вместо того чтобы вылезать за границы блока на узких экранах или оставаться маленькой на широких.
Функция clamp — один из самых удобных современных инструментов для по-настоящему плавной резиновой вёрстки: она задаёт минимальное, предпочтительное и максимальное значение одной строкой, и размер шрифта или отступа плавно меняется в этих границах вместе с шириной экрана, без резких скачков на брейкпоинтах.
Выбор между подходами редко бывает принципиальным на уровне всего сайта — чаще решение принимается для каждого конкретного блока отдельно, в зависимости от того, что в нём находится и как оно должно себя вести на разных экранах.
Подробнее о современных гибких единицах и функции clamp рассказано в статье про функцию clamp на MDN.
