Container
A layout component that wraps content with a max-width and centers it horizontally. Provides consistent page width constraints with configurable sizes and padding.
Preview & Code
_container.html.erb
███
█████████ █████████ █████████
██████
███ ██████ ██████████████████████ ██ ██
████ ███████ ████
██ ███ ██
███ ██████ ███████████████████████ █████ ████ ████████ ███ ██ ██
████ ███████ ████ ████ █████████ ████
container_component.html.erb
████ ██████████ █████████████████ ████
███ ███████ ██
██████
container_component.rb
█ ██████████████████████ ████
█████ ██████████████████ █ ███████████████████
█████ █ █████ ██ ██ ██ ███ ████████████
████████ █ ███████ ██ ██ ██████████
███ ████████████████ ████ ████████ ████ ████████████████
█████ █ ███████████
████████ █ ██████████████
██████████████ █ █████████████████████ ██ ██
Changelog
- Initial release with size variants (sm, md, lg, xl, 2xl, full)
- Configurable horizontal padding
Get Full Access
Unlock the source code for this component and all others. One-time payment for lifetime access.
Get Access Now