CSS margin-block property

Description

It is a logical property that defines space at the start and end sides of a block. The selection of start side depends on the writing-mode.

  • It behaves like margin-top and margin-bottom for the horizontal-tb writing mode.

  • It behaves like margin-right and margin-left for the vertical-* writing-mode respectively.

Change the direction of flow of text.

horizontal-tb vertical-lr vertical-rl

Syntax

margin-block : margin-block-start    margin-block-end

Property values

lengthDefault

Both the margin-block-start and margin-block-end are set to 0px.

margin-block: 0px;

length

Both the margin-block-start and margin-block-end are 20px.

margin-block: 20px;

length length

The margin-block-start and margin-block-end values are 20px and 40px respectively.

margin-block: 20px 40px;

Applicable to

It applies to all elements

From web4college, the free CSS digger

#CSS digger
Was this article helpful?

 
Check the behavior of margin-block-start for different values of writing mode.
content after the block
▾
×

Ctrl+D