CSS margin-block

The margin-block property is a shorthand property that sets the margin of an element on the block axis. The block axis is the direction in which block-level elements stack. In the case of most languages, the block axis is vertical, from top to bottom.

The margin-block property can take one, two, or three values, which represent the top, right, and bottom margins, respectively. If only one value is specified, it applies to all four sides of the element.

Here is the syntax for the margin-block property:

selector {
  margin-block: value;
}
Copy

Let's see some examples with fictional data:

In the first example, the element has a margin of 20 pixels on all sides. In the second example, the top and bottom margins are 10 pixels, and the left and right margins are 20 pixels. In the third example, the top margin is 5 pixels, the right and left margins are 10 pixels, and the bottom margin is 15 pixels.