Container
The base container to contain, pad, and center content in the viewport. This component extends the React-Bootstrap Container.
See React-Bootstrap for more documentation.
Basic Usage
Show editable code example
Any Paragon component or export may be added to the code example.
Theme Variables (SCSS)#
$max-width-xs: 464px !default;$max-width-sm: 708px !default;$max-width-md: 952px !default;$max-width-lg: 1192px !default;$max-width-xl: 1440px !default;
Props API#
Container Props API
- as
elementTypeDefault'div'Override the base element
- children
node - fluid
boolDefaulttrueFill all available space at any breakpoint
- size
enum"xs" | "sm" | "md" | "lg" | "xl"Set the maximum width for the container
Usage Insights#
Container
| Project Name | Paragon Version | Instance Count | |
|---|---|---|---|
| edx-ora2 | 20.9.2 | 1 | |
| frontend-app-account | 20.46.2 | 2 | |
| frontend-app-admin-portal | 20.39.2 | 12 | |
| frontend-app-authn | 20.46.2 | 1 | |
| frontend-app-communications | 20.46.2 | 1 | |
| frontend-app-course-authoring | 20.45.4 | 11 | |
| frontend-app-enterprise-public-catalog | 20.46.2 | 4 | |
| frontend-app-learner-dashboard | 20.46.2 | 3 | |
| frontend-app-learner-portal-enterprise | 21.1.6 | 39 | |
| frontend-app-learner-record | 20.46.2 | 1 | |
| frontend-app-library-authoring | 20.46.2 | 2 | |
| frontend-app-ora-grading | 20.46.2 | 1 | |
| frontend-app-support-tools | 20.46.0 | 6 | |
| catalog-search | 20.45.0 | 1 | |
| frontend-lib-content-components | 20.45.5 | 5 | |
| frontend-lib-special-exams | 20.44.0 | 12 | |
| frontend-platform | 20.46.2 | 1 | |
| frontend-template-application | 20.46.2 | 1 | |
| prospectus | 20.46.2 | 101 |