HTML Guide for margin

The margin property in CSS requires a numerical value followed by a unit. For example, pixels (px), percentages (%), em units (em), etc. Setting margin: px without a number is invalid.

To fix the issue, specify a numerical value before the unit. Here’s how you can correct this:

Example of incorrect HTML with inline CSS:

<div style="margin: px;">Content</div>

Corrected HTML with inline CSS:

<div style="margin: 10px;">Content</div>

In the above example, 10px is a valid value.

Alternatively, if using an external CSS file, the incorrect CSS might look like this:

.example {
  margin: px;
}

Correct the external CSS by specifying a numerical value:

.example {
  margin: 10px;
}

The value specified for a margin attribute in CSS is not valid.

The margin CSS property sets sets the margin area on all four sides of an element. There are many allowed values for this attribute, for example:

/* Apply to all four sides */
margin: 1em;
margin: -3px;

/* top and bottom | left and right */
margin: 5% auto;

/* top | left and right | bottom */
margin: 1em auto 2em;

/* top | right | bottom | left */
margin: 2px 1em 0 auto;

/* Global values */
margin: inherit;
margin: initial;
margin: revert;
margin: revert-layer;
margin: unset;

The value specified for the margin CSS attribute is not valid, probably because it’s enclosed in quotes.

The margin CSS property defines the margin for the four sides of the element. There are several ways to specify this value, as in the following examples:

/* Apply to all four sides */
margin: 1em;
margin: -3px;

/* top and bottom | left and right */
margin: 5% auto;

/* top | left and right | bottom */
margin: 1em auto 2em;

/* top | right | bottom | left */
margin: 2px 1em 0 auto;

/* Global values */
margin: inherit;
margin: initial;
margin: revert;
margin: revert-layer;
margin: unset;

In all those cases the value does not need to be specified using quotes, so the following code may raise an issue:

<style>
  .marginalized {margin: "0 0 1em 0"}
</style>

In order to fix this issue you should remove the quotes, like in the following example:

<style>
  .marginalized {margin: 0 0 1em 0}
</style>