Garrick Cheung

Sharing what I know and learn about CSS, MooTools, Javascript, PHP and etc.

CSS Best Practice #2: Shorthand Properties

Posted on | December 5, 2008 | 1 Comment

Write your CSS rules with shorthand properties. It keeps things simple and clean.

1
2
3
4
5
6
7
8
9
10

.example {
    /* long */
    padding-top:1px;
    padding-right:2px;
    padding-bottom:3px;
    padding-left:4px;
 
    /* short */
    padding:1px 2px 3px 4px;
}

To help you with the shorthand, Dustin Diaz took the time to put together a CSS shorthand guide. Way to go Dustin! Check the guide for in-depth descriptions, examples, and Dustins “quirky facts” (such as shorthand defaults).

SitePoint CSS Reference is another source for shorthand properties, or any property in general, you should/could/would use.

Category: CSS
Tags: > >

Comments

One Response to “CSS Best Practice #2: Shorthand Properties”

  1. Steven
    December 16th, 2008 @ 12:38 am

    I’ve seen cases where the shorthand has only two properties or uses the keyword “auto” or “inherit”. Can you explain the different types of shorthand? Details, man! Details!

Leave a Reply





taking viagra woman Cheap Viagra
cheap gerneric viagra?