Lover of CSS, JavaScript, React and SwiftUI. A strong believer performance and accessibility should come first and that the user should be the why, not the £££
I am now doing WebDev stuff for over 11 years and heard the rule for remembering which property stands for what a few weeks ago: clockwise! Couldn't believe that I've not come across this earlier!
Lover of CSS, JavaScript, React and SwiftUI. A strong believer performance and accessibility should come first and that the user should be the why, not the £££
That's works for when defining 4 properties shorthand, but when you have 0 8px 16px It doesn't quite work, though discussing this with a colleague and we just outright said why would you want to do this as it will confuse everyone as it's less common.
Agree, it is confusing.
But for 3 properties you can still start remembering it clockwise and if the last one is missing, it must be one of the three before - and if you remember the 2 property notation you know, one of the values is duplicated to the other property and finally you know:
top
right
bottom
are already defined and only left is missing, so it must be the same as right.
Nevertheless, it can be avoided simply :).
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Shorthand notation.
I remember
padding: 0;
padding: 1px 2px 3px 4px
but I always trip up on the ordering of
padding: 1px 2px 3px;
padding: 1px 2px;
I remember it with TRouBLe:
Top
Right
Bottom
Left
TRouBLe seems nice. An alternate way can be to remember how clockwise movement.
I am now doing WebDev stuff for over 11 years and heard the rule for remembering which property stands for what a few weeks ago: clockwise! Couldn't believe that I've not come across this earlier!
That's works for when defining 4 properties shorthand, but when you have
0 8px 16px
It doesn't quite work, though discussing this with a colleague and we just outright said why would you want to do this as it will confuse everyone as it's less common.Agree, it is confusing.
But for 3 properties you can still start remembering it clockwise and if the last one is missing, it must be one of the three before - and if you remember the 2 property notation you know, one of the values is duplicated to the other property and finally you know:
top
right
bottom
are already defined and only left is missing, so it must be the same as right.
Nevertheless, it can be avoided simply :).