m.wrap

Used to apply max-widths to content so it remains within an optimal line length.

Block

.wrap

Sets the max width and adds the page gutter to the elements.

Data

Modifiers

    • .wrap--petite

    • Enabled

    Smaller wrap than normal, sets the max width at the lap breakpoint size.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut non mi vel nibh mattis dignissim. Ut quis augue sit amet urna blandit suscipit. Morbi congue, risus et euismod condimentum, risus urna euismod libero, nec lacinia felis dui a mauris. Etiam scelerisque purus nisl, et tempus augue sagittis eget. Aliquam porta bibendum sapien, id vestibulum quam semper congue. Ut vitae euismod augue. Proin vitae dui ac purus tristique accumsan. Suspendisse leo libero, venenatis sed metus quis, placerat tincidunt enim. Vestibulum sed efficitur augue, ac hendrerit massa. Integer id metus in enim vestibulum dictum non vestibulum nibh. Nulla posuere a tellus eget auctor.

    Data

    • .wrap--wide

    • Enabled

    Full width wrap, removes the left and right page gutters.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut non mi vel nibh mattis dignissim. Ut quis augue sit amet urna blandit suscipit. Morbi congue, risus et euismod condimentum, risus urna euismod libero, nec lacinia felis dui a mauris. Etiam scelerisque purus nisl, et tempus augue sagittis eget. Aliquam porta bibendum sapien, id vestibulum quam semper congue. Ut vitae euismod augue. Proin vitae dui ac purus tristique accumsan. Suspendisse leo libero, venenatis sed metus quis, placerat tincidunt enim. Vestibulum sed efficitur augue, ac hendrerit massa. Integer id metus in enim vestibulum dictum non vestibulum nibh. Nulla posuere a tellus eget auctor.

    Data

    • .wrap--extend

    • Enabled

    Extend the wrap one column size to the left and right of the normal wrap.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut non mi vel nibh mattis dignissim. Ut quis augue sit amet urna blandit suscipit. Morbi congue, risus et euismod condimentum, risus urna euismod libero, nec lacinia felis dui a mauris. Etiam scelerisque purus nisl, et tempus augue sagittis eget. Aliquam porta bibendum sapien, id vestibulum quam semper congue. Ut vitae euismod augue. Proin vitae dui ac purus tristique accumsan. Suspendisse leo libero, venenatis sed metus quis, placerat tincidunt enim. Vestibulum sed efficitur augue, ac hendrerit massa. Integer id metus in enim vestibulum dictum non vestibulum nibh. Nulla posuere a tellus eget auctor.

    Data