Fukol™ Grids

Building a CSS Grid System isn’t that hard really, thanks to flexbox. Heydon has stripped it to its smallest form:

.fukol-grid {
  display: flex;
  flex-wrap: wrap;
  margin: -0.5em;
}

.fukol-grid > * {
  flex: 1 0 10em;
  margin: 0.5em;
}

Fukol™ is a lightweight, breakpoint free, completely responsive, element query driven*, progressive enhancement based CSS grid framework. It is 93 bytes minified, fitting comfortably inside a tweet.

Embeded below is a demo pen:

See the Pen Fukol by Heydon (@heydon) on CodePen.

Fukol™ Grids →