# Helper Functions for Column and Row Widths

There are a few different helper functions we can use to determine column (and row) measurements. The two I use constantly are:

  • repeat(): repeats a series of columns
  • minmax(): defines a minimum and maximum width of a column

If you have a series of columns that are all the same width, you could right out each width, but it's easier to use the repeat function.

grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
/* is the same as */
grid-template-columns: repeat(12, 1fr);

Note

IE's syntax is different for repeat, but Autoprefixer will take care of the translation for us.

See the Pen Grid repeat() by Dave Cross (@davecross) on CodePen.

We'll see a use of minmax() when we get to Max-width with Grid