Web Developer's Reference Guide

Global CSS keyword values

The following list of keyword values is ubiquitous to web designers and developers, but have you ever wondered what exactly they mean and do?

auto

The auto CSS keyword value tells the browser to automatically compute the CSS property's value, and it looks like this:

margin: auto;

The term auto is short for automatic. It's not the same as saying 100% because 100% is an actual defined value; auto is calculated by the browser.

One of the most common locations to see the keyword auto applied is when centering an element horizontally with the margin CSS property.

CSS:

.element {
  margin: auto;
}

Tip

I've seen most people use margin: 0 auto; to center an element. This is fine, but the value zero (0) can be omitted. margin: auto; is ...