Layout & Navigation
Grid alpha

Our Grid

Layout

Usage

All layouts in Alation should be built off of this grid. Every row has 16 columns, and rows can be nested.

The grid should be used to place blocks on a page, however the space of items inside of those blocks should not use the grid, but should instead use Space Units.

Metrics

  • 16 columns
  • Gutter: 1.58% (of row width)
  • Column Width: 4.8% (of row width)

Backstory

Our grid is based on a 978px wide grid. The original metrics are...

  • Gutter: 15px
  • Column Width: 47px

Changelog

  • December 9, 2016 - Promoted to Alpha