CSS Snippet Cheatsheet

Ever have trouble recalling the exact syntax for your favorite CSS code? Give it a permanent home and add it to this page! Select any snippet below and it will automatically select all of the code for you to copy.


Flexbox Row

Use these properties to create a Flexbox row layout.

.row {

  display: flex;

  flex-direction: row;

  flex-wrap: wrap;

}

Flexbox Column

Use these properties to create a Flexbox column layout.

.row {

  display: flex;

  flex-direction: column;

  flex-wrap: wrap;

}

CSS Grid Layout

Build a 12-column layout using CSS Grid.

.grid {

  display: grid;

  width: 100%;

  grid-template-columns: repeat(12, 1fr);

}