<div class="o-prose">
    <div class="u-no-break-inside">
        <h2><code>.u-no-break-inside</code> Avoids any break (page, column, or region) from being inserted within the principal box</h2>
        <p>Lorem ipsum dolor amet mustache knausgaard +1, blue bottle waistcoat tbh semiotics artisan synth stumptown gastropub cornhole celiac swag. Brunch raclette vexillologist post-ironic glossier ennui XOXO mlkshk godard pour-over blog tumblr humblebrag. Blue bottle put a bird on it twee prism biodiesel brooklyn. Blue bottle ennui tbh succulents.</p>
    </div>

    <div class="u-break-after">
        <h2><code>.u-break-after</code> Forces a page break right after the principal box.</h2>
        <p>Lorem ipsum dolor amet mustache knausgaard +1, blue bottle waistcoat tbh semiotics artisan synth stumptown gastropub cornhole celiac swag. Brunch raclette vexillologist post-ironic glossier ennui XOXO mlkshk godard pour-over blog tumblr humblebrag. Blue bottle put a bird on it twee prism biodiesel brooklyn. Blue bottle ennui tbh succulents.</p>
    </div>

    <div class="u-break-before">
        <h2><code>.u-break-before</code> Forces a page break right before the principal box.</h2>
        <p>Lorem ipsum dolor amet mustache knausgaard +1, blue bottle waistcoat tbh semiotics artisan synth stumptown gastropub cornhole celiac swag. Brunch raclette vexillologist post-ironic glossier ennui XOXO mlkshk godard pour-over blog tumblr humblebrag. Blue bottle put a bird on it twee prism biodiesel brooklyn. Blue bottle ennui tbh succulents.</p>
    </div>
</div>
<div class="o-prose">
    <div class="u-no-break-inside">
        <h2><code>.u-no-break-inside</code> Avoids any break (page, column, or region) from being inserted within the principal box</h2>
        <p>Lorem ipsum dolor amet mustache knausgaard +1, blue bottle waistcoat tbh semiotics artisan synth stumptown gastropub cornhole celiac swag. Brunch raclette vexillologist post-ironic glossier ennui XOXO mlkshk godard pour-over blog tumblr humblebrag. Blue bottle put a bird on it twee prism biodiesel brooklyn. Blue bottle ennui tbh succulents.</p>
    </div>

    <div class="u-break-after">
    <h2><code>.u-break-after</code> Forces a page break right after the principal box.</h2>
    <p>Lorem ipsum dolor amet mustache knausgaard +1, blue bottle waistcoat tbh semiotics artisan synth stumptown gastropub cornhole celiac swag. Brunch raclette vexillologist post-ironic glossier ennui XOXO mlkshk godard pour-over blog tumblr humblebrag. Blue bottle put a bird on it twee prism biodiesel brooklyn. Blue bottle ennui tbh succulents.</p>
    </div>

    <div class="u-break-before">
        <h2><code>.u-break-before</code> Forces a page break right before the principal box.</h2>
        <p>Lorem ipsum dolor amet mustache knausgaard +1, blue bottle waistcoat tbh semiotics artisan synth stumptown gastropub cornhole celiac swag. Brunch raclette vexillologist post-ironic glossier ennui XOXO mlkshk godard pour-over blog tumblr humblebrag. Blue bottle put a bird on it twee prism biodiesel brooklyn. Blue bottle ennui tbh succulents.</p>
        </div>
</div>
/* No context defined. */
  • Content:
    /* ======================================================================
       # _components.break.css
       ====================================================================== */
    
    .u-break-inside-avoid {
      page-break-inside: avoid;
      break-inside: avoid;
    }
    
    .u-break-after-avoid {
      page-break-after: avoid;
      break-after: avoid;
    }
    
    .u-break-after {
      page-break-after: always;
      break-after: page;
    }
    
    .u-break-before {
      page-break-before: always;
      break-before: page;
    }
    
  • URL: /components/raw/break/_components.break.css
  • Filesystem Path: src/components/02-Utilities/break/_components.break.css
  • Size: 472 Bytes

No notes defined.