<div class="Grid Grid--withGutter u-padding-all-l">
    <div class="Grid-cell u-sizeFull u-md-size1of2 u-lg-size1of4">
        <div class="u-background-50 u-color-white u-margin-bottom-l u-borderRadius-m u-padding-all-m">1/4 responsive</div>
    </div>
    <div class="Grid-cell u-sizeFull u-md-size1of2 u-lg-size1of4">
        <div class="u-background-50 u-color-white u-margin-bottom-l u-borderRadius-m u-padding-all-m">1/4 responsive</div>
    </div>
    <div class="Grid-cell u-sizeFull u-md-size1of2 u-lg-size1of4">
        <div class="u-background-50 u-color-white u-margin-bottom-l u-borderRadius-m u-padding-all-m">1/4 responsive</div>
    </div>
    <div class="Grid-cell u-sizeFull u-md-size1of2 u-lg-size1of4">
        <div class="u-background-50 u-color-white u-margin-bottom-l u-borderRadius-m u-padding-all-m">1/4 responsive</div>
    </div>
</div>
  • Content:
    /** @define Grid; */
    
    .Grid--withGutterM {
      margin: 0 -var(--Grid-gutter-size);
    }
    
    .Grid--withGutterM > .Grid-cell {
      padding: 0 calc(var(--Grid-gutter-size));
    }
    
    .Grid--withGutterL {
      margin: 0 calc(-1.5 * var(--Grid-gutter-size));
    }
    
    .Grid--withGutterL > .Grid-cell {
      padding: 0 calc(1.5 * var(--Grid-gutter-size));
    }
    
  • URL: /components/raw/grid/index.css
  • Filesystem Path: src/components/grid/index.css
  • Size: 325 Bytes

There are no notes for this item.