A simple container object pattern which restricts content to a maximum of
1170px width. In practice, this is typically used with the layout object to contruct a traditional
1170px grid system. For a more general introduction to grid systems, try here.
A simple implementation.
<div class='o-container'> I won't go beyond 1170px wide. </div>
A list of modifiers for the container component, allowing you to change its appearance to fit a variety of roles and scenarios.
Modifiers can typically be combined to achieve the desired appearance, unless stated otherwise.
This removes the
1170px max width of the container object and makes it stretch the full width of its parent element.
<div class='o-container o-container--fluid'> I will expand to fill my parent element. </div>