Mozilla Protocol
  • 19.1.0

Button Container: Stretched

The mzp-l-stretch class makes buttons fill the width of the container. Multiple buttons will be stacked and full-width in smaller viewports, and appear inline and stretched in larger viewports. This option is best suited to narrow forms.

<div class="mzp-c-button-container mzp-l-stretch">
    <button class="mzp-c-button" type="button">Primary</button>
    <button class="mzp-c-button mzp-t-secondary" type="button">Secondary</button>
    <p class="mzp-c-button-info">More information.</p>
</div>