HTML Guides for comma

The values of the padding property are separated by spaces, not commas: write padding: 10px 20px, not padding: 10px, 20px.

padding is a shorthand that takes one to four lengths or percentages. One value applies to all four sides. Two values set the top and bottom, then the left and right. Three set the top, then left and right, then the bottom. Four go clockwise from the top: top, right, bottom, left.

In CSS a comma separates the items of a list, such as the fonts in font-family or the layers in box-shadow. padding doesn't take a list, so the validator reports the comma as an incorrect operator. Browsers drop the whole declaration, and the element keeps whatever padding an earlier rule gave it, or none. The habit often comes from JavaScript, or from CSS functions like rgb(255, 0, 0) where commas separate the arguments.

Invalid example

<div style="padding: 10px, 20px;">

<p>Card content</p>

</div>

Valid example

<div style="padding: 10px 20px;">

<p>Card content</p>

</div>