The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Why or How does margin:0 auto; work?

  • # June 10, 2009 at 5:33 pm

    In many of Chris’ videos the margin:0 auto; statement is referred to as a "Trick". So I went off on a search to find out why this "Trick" works. Looking at I see that auto simply means let the browser set the margin. But I don’t understand why the preceeding 0 is required.

    I know that margin:0 simply means set all 4 sides to 0. But what does it mean when you put a space between 0 and auto?

    # June 10, 2009 at 5:39 pm

    its the shorthand :)

    margin:0 auto; = the top and bottom margin 0, and the left and right margin auto :)

    # June 10, 2009 at 5:52 pm

    yeh. Margin shorthand:

    margin: ALL;

    yes, right comes first weirdly.

    # June 10, 2009 at 5:54 pm
    "mattvot" wrote:
    yes, right comes first weirdly.

    Like a clock :D

    # June 10, 2009 at 5:58 pm

    Yeah it’s clockwise order. Why a CSS parser should work like a clock, on the otherhand, is a complete mystery.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed