🏠 New in High Baseline Support: Logical properties

March 20, 2024

caniuse · mdn · spec

CSS logical properties control borders, size, margin, and padding with directions and dimensions relative to the writing mode. For example, in a left to right, top to bottom writing mode, block-end refers to the bottom. Also known as flow relative.

Source features

• css.properties.block-size [mdn]
• css.properties.inline-size [mdn]
• css.properties.max-block-size [mdn]
• css.properties.max-inline-size [mdn]
• css.properties.min-block-size [mdn]
• css.properties.min-inline-size [mdn]
• css.properties.block-size.max-content [mdn]
• css.properties.block-size.min-content [mdn]
• css.properties.inline-size.max-content [mdn]
• css.properties.inline-size.min-content [mdn]
• css.properties.max-block-size.max-content [mdn]
• css.properties.max-block-size.min-content [mdn]
• css.properties.max-inline-size.max-content [mdn]
• css.properties.max-inline-size.min-content [mdn]
• css.properties.min-block-size.max-content [mdn]
• css.properties.min-block-size.min-content [mdn]
• css.properties.min-inline-size.max-content [mdn]
• css.properties.min-inline-size.min-content [mdn]
• css.properties.border-block-end [mdn]
• css.properties.border-block-end-color [mdn]
• css.properties.border-block-end-style [mdn]
• css.properties.border-block-end-width [mdn]
• css.properties.border-block-start [mdn]
• css.properties.border-block-start-color [mdn]
• css.properties.border-block-start-style [mdn]
• css.properties.border-block-start-width [mdn]
• css.properties.border-inline-end [mdn]
• css.properties.border-inline-end-color [mdn]
• css.properties.border-inline-end-style [mdn]
• css.properties.border-inline-end-width [mdn]
• css.properties.border-inline-start [mdn]
• css.properties.border-inline-start-color [mdn]
• css.properties.border-inline-start-style [mdn]
• css.properties.border-inline-start-width [mdn]
• css.properties.margin-block-end [mdn]
• css.properties.margin-block-start [mdn]
• css.properties.margin-inline-end [mdn]
• css.properties.margin-inline-start [mdn]
• css.properties.padding-block-end [mdn]
• css.properties.padding-block-start [mdn]
• css.properties.padding-inline-end [mdn]
• css.properties.padding-inline-start [mdn]
• css.properties.inset-block [mdn]
• css.properties.inset-block-end [mdn]
• css.properties.inset-block-start [mdn]
• css.properties.inset-inline [mdn]
• css.properties.inset-inline-end [mdn]
• css.properties.inset-inline-start [mdn]
• css.properties.border-block [mdn]
• css.properties.border-block-color [mdn]
• css.properties.border-block-style [mdn]
• css.properties.border-block-width [mdn]
• css.properties.border-inline [mdn]
• css.properties.border-inline-color [mdn]
• css.properties.border-inline-style [mdn]
• css.properties.border-inline-width [mdn]
• css.properties.inset [mdn]
• css.properties.margin-block [mdn]
• css.properties.margin-inline [mdn]
• css.properties.padding-block [mdn]
• css.properties.padding-inline [mdn]
• css.properties.inset-block-end.auto [mdn]
• css.properties.inset-block-start.auto [mdn]
• css.properties.inset-block.auto [mdn]
• css.properties.inset-inline-end.auto [mdn]
• css.properties.inset-inline-start.auto [mdn]
• css.properties.inset-inline.auto [mdn]
• css.properties.inset.auto [mdn]
• css.properties.border-end-end-radius [mdn]
• css.properties.border-end-start-radius [mdn]
• css.properties.border-start-end-radius [mdn]
• css.properties.border-start-start-radius [mdn]
• css.properties.block-size.fit-content [mdn]
• css.properties.inline-size.fit-content [mdn]
• css.properties.max-block-size.fit-content [mdn]
• css.properties.max-inline-size.fit-content [mdn]
• css.properties.min-block-size.fit-content [mdn]
• css.properties.min-inline-size.fit-content [mdn]
• css.properties.clear.inline-end [mdn]
• css.properties.clear.inline-start [mdn]
• css.properties.float.inline-end [mdn]
• css.properties.float.inline-start [mdn]