Когда вы выбираете между фиксированной шириной и шириной жидкости, вы должны думать в терминах вашей ВСЕЙ страницы. Как правило, вы хотите выбрать один или другой, но не оба. Примеры, которые вы перечислили в своем вопросе, на самом деле, находятся на одной странице с фиксированной шириной. Другими словами, страница Scaffolding использует макет фиксированной ширины. фиксированная сетка и жидкостная сетка на странице "Строительные леса" предназначены не для примера, а для документации по реализации макетов с фиксированной и изменяемой шириной.
Пример правильной фиксированной ширины здесь .
Пример правильной ширины жидкости здесь .
При рассмотрении примера с фиксированной шириной вы не должны видеть изменения размера контента, когда ваш браузер имеет ширину более 960 пикселей. Это максимальная (фиксированная) ширина страницы. Медиа-запросы в дизайне с фиксированной шириной будут определять минимальную ширину для определенных стилей. Вы увидите это в действии, когда сократите окно браузера и увидите, что макет привязан к другому размеру.
И наоборот, макет ширины жидкости будет всегда растягиваться, чтобы соответствовать окну вашего браузера, независимо от его ширины. Медиа-запросы указывают, когда стили меняются, но ширина контейнеров всегда в процентах от вашего окна браузера (а не фиксированное количество пикселей).
Все «отзывчивые» медиа-запросы готовы к работе. Вам просто нужно решить, хотите ли вы использовать макет фиксированной ширины или ширины жидкости для вашей страницы.
Ранее в начальной загрузке 2 вам приходилось использовать row-fluid внутри контейнера с жидкостью и row внутри фиксированного контейнера. С введением начальной загрузки 3, row-fluid был удален, больше не использует его .
РЕДАКТИРОВАТЬ : Согласно комментариям, некоторые jsFiddles для:
Эти скрипты полностью не загружаются при загрузке и основаны на чистых медиазапросах CSS, что делает их хорошей отправной точкой для тех, кто хочет создать подобное решение без использования Twitter Bootstrap.