Элемент контейнера

Элемент контейнера может быть выровнен для достижения множества целей.

• Расположение элементов по горизонтали
• Добавление дополнительного фона или тени
• Фон или изображение на всю ширину

Расположение элементов по горизонтали

Добавление колонок и установка соотношения ширины

После добавления контейнера на холст, вы можете увидеть, что в вкладке Данные есть только 1 колонка.

Нажмите Колонка, чтобы добавить больше колонок. И отрегулируйте их Соотношение ширины, чтобы создать желаемую компоновку. На скриншоте я установил соотношение 2:1, где левая колонка в 2 раза шире по сравнению с правой колонкой.

Всегда горизонтально

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

В большинстве случаев это нормально. Но если вы хотите, чтобы ваши колонки всегда были расположены горизонтально, нажмите вкладку Содержимое и проверьте поле Тип. Выберите Всегда горизонтально. И ваш контент будет расположен горизонтально независимо от размера экрана.

Автоматическая ширина колонки

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

Один столбец

Когда в контейнере только один столбец, это все равно полезно. Например, вы можете добавить дополнительный Фон и дополнительный Тень блока к нему.

Фон на всю ширину

Фон на всю ширину можно создать с помощью контейнера. Просто установите Форма -> Ширина на Полная ширина экрана. Контейнер будет простираться до краев экрана слева направо.

Но содержимое внутри контейнера все равно будет ограничено шириной элемента страницы. Вы можете сделать так, чтобы содержимое простиралось до края контейнера, установив Содержимое -> Внутренняя ширина на 100%.

Изображение на всю ширину

Как показано на скриншоте выше, если вы установите Форма -> Ширина элемента изображения на Заполнить, элемент изображения будет простираться до края контейнера, игнорируя отступы и промежутки контейнера и столбца.