You’ll have no doubt seen:

padding: 5px 10px 5px 10px;

in a CSS file. Do you ever wonder which of the properties are which?

Just start at the top and move clockwise until you reach the left side.

Top Right Bottom Left

It saves doing this:-

padding-top: 5px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;

Just a simple one that I’m sure 99.9% of people knew.

By admin

3 thought on “CSS properties direction (padding, margins, etc)”
  1. http://www.w3schools.com/css/css_padding.asp
    This answers the thing … works for “margin” as well…

    The padding property can have from one to four values.

    padding:25px 50px 75px 100px;
    top padding is 25px
    right padding is 50px
    bottom padding is 75px
    left padding is 100px

    padding:25px 50px 75px;
    top padding is 25px
    right and left paddings are 50px
    bottom padding is 75px

    padding:25px 50px;
    top and bottom paddings are 25px
    right and left paddings are 50px

    padding:25px;
    all four paddings are 25px

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.