AtoZ CSS: The CSS Value of Auto

Part of Screencast Series: AtoZ CSS

Published September 2016

A is for Auto

Auto is the default value for dimension properties width and height.

Setting margin:0 auto and a width or max-width allows a block of content to be horizontally centered on the page.

There is a subtle difference between width:auto and width:100%. When combining width:auto with padding, the width is automatically calculated and takes the padding into account - whereas width:100% sets the width to 100% of the element’s parent with padding added additionally.

In CSS positioning, top and left take priority over bottom and right. If you need to override a previously declared top or left position, they first need to be set to auto.


Have your say! or become a member now to take part in the discussion

Meet your instructor
Guy Routledge

Front-end dev, teacher at The General Assembly London. A to Z CSS screencaster, founder @saplingdigital and co-founder @thefoodrush.