Container
Introduction
A container is a layout element that can be used to simultaneously style, hide, drag, or delete a group of widgets placed in it:
In a browser, it is rendered as a simple div
element by default. It is also possible to render a container as one of HTML5 semantic elements (for example, section
, main
, article
, nav
).
Properties Pane
The properties pane is divided into two major sections by a toggle at the top of the pane: Properties and Styling. Container properties consist of the following sections:
Properties:
Styling:
Properties
General Section
Render Mode
The Render mode determines which HTML5 tag will be used to show the container in the web browser.
Value | HTML Tag |
---|---|
Div (default) | div |
Section | section |
Article | article |
Header | header |
Footer | footer |
Main | main |
Nav | nav |
Aside | aside |
Hgroup | hgroup |
Address | address |
Visibility Section
Visibility determines whether a widget is displayed to the end-user as part of the page.
For more information on properties of this section, see the Visibility Section section in Properties Common in the Page Editor.
Events Section
On-Click
The On-click property specifies the action that will be executed when the user clicks the container (either with their mouse pointer or by pressing the Enter or Space keys when the container is in focus).
Common Section
Accessibility Section
Hide for Screen Readers
This property specifies whether to hide the container from screen readers or not.