Поскольку веб-сайты превратились из простых документов в сложные интерактивные приложения, методы макета документов, например плавающие объекты, не всегда хорошо подходили для макета приложения. Используя комбинацию таблиц, JavaScript или тщательных измерений для плавающих элементов, авторы нашли обходные пути для достижения желаемых макетов. Макеты, которые адаптировались к доступному пространству, часто были хрупкими и приводили к нелогичному поведению, поскольку пространство становилось ограниченным. В качестве альтернативы авторы многих веб-приложений выбрали фиксированную компоновку, которая не может использовать изменения доступного пространства рендеринга на экране.
Возможности компоновки сетки решают эти проблемы. Он предоставляет механизм для авторов, чтобы разделить доступное пространство для макета на столбцы и строки, используя набор предсказуемого поведения размеров. Затем авторы могут точно позиционировать и масштабировать элементы строительного блока своего приложения в областях сетки, определенных пересечениями этих столбцов и строк. Следующие примеры иллюстрируют адаптивные возможности компоновки сетки и то, как она позволяет более четко разделить контент и стиль.
