What is the shorthand grid-column property in CSS Grid?

grid-column combines grid-column-start and grid-column-end into one start / end declaration (and grid-row does the same for rows).

Instead of two separate properties for an item's horizontal span, you write both line numbers separated by a slash:

header {
  /* Same as grid-column-start: 1; grid-column-end: 5; */
  grid-column: 1 / 5;
}
article {
  grid-column: 1 / 4;  /* spans from line 1 to line 4 */
  grid-row: 2 / 3;     /* sits in row 2 only */
}

Two handy shortcuts:

/* -1 means "the last line", so this spans the full width */
.full-width { grid-column: 1 / -1; }

/* "span N" spans N tracks from wherever the item starts */
.span-two { grid-column: span 2; }

grid-column: 1 / -1 is especially useful for full-width headers and footers, because it adapts automatically if you later add or remove columns.