Shorthand Properties creates one liner css declarations

Created: 2022-10-02

Properties that have shorthand things:

• font, background,
• padding, border,
• margin

Example:

padding: 10px 15px 15px 5px;
Copy

is equivalent to these four lines of code:

padding-top: 10px;
padding-right: 15px;
padding-bottom: 15px;
padding-left: 5px;
Copy

More Example:

background: red url(bg-graphic.png) 10px 10px repeat-x fixed;
Copy

Is equivalent to this five lines

background-color: red;
background-image: url(bg-graphic.png);
background-position: 10px 10px;
background-repeat: repeat-x;
background-attachment: fixed;
Copy