DEV Community

Discussion on: What's the one thing you always need to google?

Collapse
emma profile image
Emma Goto 🍙

The shorthand form of css padding - e.g. when you do padding: 8px 0 I can never remember which sides it applies to.

Collapse
satishpatro44 profile image
satishpatro44

Always clockwise. If one to all. If two, two opposite starting from top. If three top right side common buttom. If four clockwise from top. This is how I remember

Collapse
lkhrs profile image
Luke

Thank you, I've just been switching the values around until it works for the past 8 years. Kept forgetting to just look it up and keep it as a stickynote on my desk

Collapse
wobsoriano profile image
Robert • Edited

For real! Me too

Collapse
cubiclesocial profile image
cubiclesocial

You can always use the long-form: padding-top, padding-right, padding-bottom, padding-left. There can be advantages to using the long-form as well if you don't want to override some parent style by accident.

I generally prefer using em (e.g. 7px is ~0.3em) rather than px for most padding and margins. That way, if someone enlarges the page, the padding/margins scale up too and keeps the presentation looking nice and spaced out properly without expending any extra effort. I use px in select (aka rare) locations where something needs to remain 'x' pixels from a specific edge regardless of text size.