Logical properties and values provide the author with the ability to control layout through logical, rather than physical, direction and dimension mappings. Logical dimensions help design content for LTR/RTL languages. There are defined by CSSWG in this draft documentation
It consists in :
margin-block-start, margin-block-end, margin-inline-start, margin-inline-end
offset-block-start, offset-block-end, offset-inline-start, offset-inline-end
padding-block-start, padding-block-end, padding-inline-start, padding-inline-end
border-block-start-width, border-block-end-width, border-inline-start-width, border-inline-end-width
border-block-start-style, border-block-end-style, border-inline-start-style, border-inline-end-style
border-block-start-color, border-block-end-color, border-inline-start-color, border-inline-end-color
border-block-start, border-block-end, border-inline-start, border-inline-end
Physical values can also be modified with the logical keyword for shorthand properties :
margin: logical 1em 2em 3em 4em;
Some of those logical properties are already implemented either directly or with vendor prefix : https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline-end#Browser_compatibility
Logical properties and values provide the author with the ability to control layout through logical, rather than physical, direction and dimension mappings. Logical dimensions help design content for LTR/RTL languages. There are defined by CSSWG in this draft documentation
It consists in :
margin-block-start,margin-block-end,margin-inline-start,margin-inline-endoffset-block-start,offset-block-end,offset-inline-start,offset-inline-endpadding-block-start,padding-block-end,padding-inline-start,padding-inline-endborder-block-start-width,border-block-end-width,border-inline-start-width,border-inline-end-widthborder-block-start-style,border-block-end-style,border-inline-start-style,border-inline-end-styleborder-block-start-color,border-block-end-color,border-inline-start-color,border-inline-end-colorborder-block-start,border-block-end,border-inline-start,border-inline-endPhysical values can also be modified with the
logicalkeyword for shorthand properties :margin: logical 1em 2em 3em 4em;Some of those logical properties are already implemented either directly or with vendor prefix : https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline-end#Browser_compatibility