Save space in your CSS documents by writing it in shorthand. So when you create your margins you might write them out for each section, top, bottom, left and right. By using the shorthand method you can condense it to just one line.
element{ margin:10px 5px 10px 5px; /*each correspond to a section in this order
TOP, RIGHT, BOTTOM, LEFT */ margin: 10px 5px; /*each correspond to a section in this order
TOP & BOTTOM - LEFT & RIGHT */ margin: 5px; /*This puts a 5px margin around the element*/
}
This can apply to other elements aswell like padding and border.
element{ padding:2px 5px 2px 5px; /*each correspond to a section in this order
TOP, RIGHT, BOTTOM, LEFT */
padding: 10px 5px; /*each correspond to a section in this order
TOP & BOTTOM - LEFT & RIGHT */ padding: 5px; /*This puts padding of 5px around the element*/
}
With the border they can be put in any order and it will still work.
element{ border:1px solid #ff0000; /*in order from first part is line thickness, line type and colour*/
}
« Back to web creator tutorials
Rollover navigation with just css Personlize Hyperlinks Write Shorthand CSS Set opacity in IE5.5 - IE8 Set opacity in Fire Fox, Safari, Opera, Chrome