Home
Usage
Marketeers
Designers
Developers
Contribution
Pipelne
Foundations
Color
Typography
Actions
Structured Text
Images
Content
Voice and Tone
Mechanics, Grammar and Inclusivity
Patterns
In Page Navigation
Containers / Sections
Typographic patterns
Content and Media
Taxonomies
Images with Overlaid Text
Pagination
Social Share Buttons
Spinner
Agility Page Components
Styling Definitions
Text
Text and Media
Carousels
Accordion
Grid Content

Containers and Sections

Containers dictate how wide content flows horizontally. It is responsive over many viewports.

Sections, on the other hand, allow for content flows vertically.

This has a small padding (space between the border and the background. And a small margin (space between the border and the next section below.

This has a medium padding (space between the border and the background. And a medium margin (space between the border and next section below.

This has a large padding (space between the border and the background. And a large margin (space between the border and the next section below.

This has the default padding (space between the border and the background. And no margin below.