This container element sets the maximum width of content on the page, centers the column horizontally in the viewport, and includes some padding that prevents its contents from butting against the edges of the viewport or against other adjacent elements. The maximum width and spacing change at different responsive breakpoints to adapt to different viewport widths.
304px and constrained to a maximum width that differs at different responsive
breakpoints. If you want to know how wide this box is, the answer is: it depends.
mzp-t-content-nospace to override the top and bottom padding (left and right
inner container defining the column centered within that section. If you need
a page section to have a “full bleed” background that extends to the edges of
the window, apply that background to an outer container and not to
mzp-l-content container element inside another one. The width
and spacing adjusts to the viewport breakpoint so nested containers may do
unpredictable things as the window size changes.
mzp-l-content container as part of the component. Don’t nest those components
<h3>Sphinx of black quartz, judge my vow!</h3>
<p>It is a period of civil war. Rebel spaceships, striking from a hidden base,
have won their first victory against the evil Galactic Empire. During the
battle, Rebel spies managed to steal secret plans to the Empire’s ultimate
weapon, the DEATH STAR, an armored space station with enough power to destroy
an entire planet. Pursued by the Empire’s sinister agents, Princess Leia
races home aboard her starship, custodian of the stolen plans that can save
her people and restore freedom to the galaxy...</p>