Skip to main content
Studio Mega

Example: Containers

Each image below is placed within a predefined maximum width container. While these containers may appear the same on smaller screens, as the viewport expands, the container width will reach its selected maximum limit.

The Max Width options include:

  • Full: edge to edge
  • Full (with margin): edge to edge with margin
  • X-large: fluid container, max width of 1,792px
  • Large: fluid container, max width of 1,536px
  • Medium: fluid container, max width of 1,280px
  • Small: fluid container, max width of 1,024px
  • Content: fluid container, max width of 672px, set for ideal line length for the body copy and typically only used for text content
Max Width: Full
Max Width: Full (with margin)
Max Width: X-large (1,792px)
Max Width: Large (1,536px)
Max Width: Medium (1,280px)
Max Width: Small (1,024px)
Max Width: Content (672px)