When adding padding to a tag using CSS you sometimes see people who list all measurements together. E.G.
| padding: 1px 6px 0px 2px; |
At first I didn't know which measurement was for which direction of padding, but then I remembered that old saying "Never Eat Shredded Wheat" (If your not from the UK or younger than 18 you probably won't understand that). It was a saying to remember the directions: North, East, South & West. What has this got to do with padding I hear you cry? Here's what:
You see on the above image, North, East, South and West ... well lay this image down flat and we have top, right, bottom and left.
So, instead of:
| padding-top: 1px;
padding-right: 2px; padding-bottom: 6px; padding-left: 3px; |
We can just have;
| padding: 1px 2px 6px 3px; |
Which is the same thing but with less code bloat. I hope this tutorial helps lower the sizes of your CSS stylesheets as it did for me.





