Editor X: О стеках

Стекинг — полезный инструмент в адаптивном дизайне: без него элементы, расположенные друг над другом, могут взаимно перекрываться на небольших экранах. Когда вы помещаете элементы в стеки, они оказываются во гибком контейнере с отступами, которые вы можете контролировать.

Адаптивные сайты часто содержат элементы, у которых размер и положение меняются в зависимости от размера экрана. Это может привести к тому, что элементы будут перекрываться или расстояние между ними уменьшится на экранах небольшого размера.

Стек помещает ваши элементы в контейнер, который автоматически подстраивается под разные размеры экрана. Таким образом вы сможете обеспечить адаптивность вашего макета.

Ниже пример того, что происходит с элементами, которые НЕ СОЕДИНЕНЫ В СТЕК, при изменении размера экрана:

Стекинг создает гибкий контейнер вокруг ваших элементов. Контейнер гарантирует, что элементы всегда будут упорядочены нужным образом. Контейнер по умолчанию прозрачный, но вы можете оформить его в соответствии со стилем сайта, настроив цвет фона, границы, углы и тень.

Элементы в стеке разделяются вертикальными отступами. Чтобы увидеть полоски, отображающие текущие отступы, наведите курсор на стек или выделите его. Дважды щелкните на элементы внутри стека и переместите их, чтобы изменить расстояние между ними.

Другой вариант позволяет сделать все отступы одинаковыми по высоте: для этого в панели Инспектора нужно ввести конкретное значение в пикселях или в % в поле Между элементами в разделе Настройки стека.