• Visual Language
  • Grid

Mixed Mobile/Tablet/Desktop grid

View Mixed Mobile/Tablet/Desktop grid

 
<div class="grid-wrap">
  <div class="grid-col grid-one-third tablet-grid-two-thirds desktop-grid-one-half">
    <code>Mobile - 1/3. Tablet - 2/3. Dekstop - 1/2</code>
  </div>
  <div class="grid-col grid-two-thirds tablet-grid-one-third desktop-grid-one-half">
    <code>Mobile - 2/3. Tablet - 1/3. Dekstop - 1/2</code>
  </div>
</div>
<div class="grid-wrap">
  <div class="grid-col grid-one-quarter tablet-grid-three-quarters desktop-grid-one-half">
    <code>Mobile - 1/4. Tablet - 3/4. Dekstop - 1/2</code>
  </div>
  <div class="grid-col grid-three-quarters tablet-grid-one-quarter desktop-grid-one-half">
    <code>Mobile - 1/3. Tablet - 2/3. Dekstop - 1/2</code>
  </div>
</div>
<div class="grid-wrap">
  <div class="grid-col grid-one-sixth tablet-grid-five-sixths desktop-grid-one-half">
    <code>Mobile - 1/6. Tablet - 5/6. Dekstop - 1/2</code>
  </div>
  <div class="grid-col grid-five-sixths tablet-grid-one-sixth desktop-grid-one-half">
    <code>Mobile - 5/6. Tablet - 1/6. Dekstop - 1/2</code>
  </div>
</div>