Weekday Tip: CSS Shorthand pt.1

by Fire G on May. 4th in CSS, Coding, Weekday Tips with 2 comments.

Margin & Padding

The CSS properties "margin" and "padding" allow the use of shorthand declarations, meaning we can state all the "-top", "-left", "-bottom", and "-right" attributes in one call.

margin: [top] [right] [bottom] [left];
margin: [top&bottom] [left&right];
margin: [top] [left&right] [bottom];
margin: [top&left&bottom&right];

padding: [top] [right] [bottom] [left];
padding: [top&bottom] [left&right];
padding: [top] [left&right] [bottom];
padding: [top&left&bottom&right];

About the author: Fire G

Hey, I'm the founder of Fire Studios, and thus, have my hands in everything that goes on here at FS. I manage the content, moderate the comments, design everything, code everything, provides a lot of articles, host the official podcast FS-Air, and run/manage most of the other sites in the FI family. Often times I'll come to be working on so many things that I hardly accomplish much, but that's what makes me who I am.

2 Reader Comments

Scott Radcliff
May 10th

You have an error in your information and I didn't see your email address on the page. Top Left Bottom Right is incorrect. It should Top Right Bottom Left.
Fire G
May 10th

Thanks for catching that!