I can't imagine how you would know the shorthand without first knowing the longer form. CSS shorthand requires that you know the original form + the order of values in shorthand, and when values can be omitted along with special formatting as in:
font: normal normal 1em/1.6em sans-serif;
CSS shorthand is - I would say - more advanced than long form.
> I'm going to ask the designer what units to use
I would never get in the habit of letting a designer tell the front-end developers how to write CSS, mainly because they work in pixels, when the developer is often using viewport units, rem for sizing, em for fonts and icons relative to an initial size and current user zoom factor, and flex gaps and alignment for spacing. That level of collaboration and specification on spacing, sizes, etc. between the developer and designer (redlining) might be part of an initial design system discussion, but the resulting component library is probably translated into a style system that works well for the engineering team.
I think it's good you're using CSS generators, I learned most of CSS that way via Dreamweaver, and have copy/pasted from CSS Tricks countless times for edge case stuff - it's a great way to learn.
CSS shorthand meaning:
which is the same as: etc.I can't imagine how you would know the shorthand without first knowing the longer form. CSS shorthand requires that you know the original form + the order of values in shorthand, and when values can be omitted along with special formatting as in:
CSS shorthand is - I would say - more advanced than long form.> I'm going to ask the designer what units to use
I would never get in the habit of letting a designer tell the front-end developers how to write CSS, mainly because they work in pixels, when the developer is often using viewport units, rem for sizing, em for fonts and icons relative to an initial size and current user zoom factor, and flex gaps and alignment for spacing. That level of collaboration and specification on spacing, sizes, etc. between the developer and designer (redlining) might be part of an initial design system discussion, but the resulting component library is probably translated into a style system that works well for the engineering team.
I think it's good you're using CSS generators, I learned most of CSS that way via Dreamweaver, and have copy/pasted from CSS Tricks countless times for edge case stuff - it's a great way to learn.