CSS Logical Properties

The CSS Logical Properties introduces {inline-,block-}size and {min-,max-}{inline-,block-}size, which provide the author with the ability to control layout through logical, rather than physical, direction and dimension mappings.

Demos

• https://jsfiddle.net/xuxing/fL8rpcko/
• https://jsfiddle.net/xuxing/433e3fdw/
• https://jsfiddle.net/xuxing/25xh1mpn/
• https://jsfiddle.net/xuxing/ug00c0vj/

Documentation

• https://drafts.csswg.org/css-writing-modes/#logical-to-physical

Specification

Editor's draft

Status in Chromium

Blink components: Blink>CSS

No active development (launch bug)

Consensus & Standardization

• Firefox: Shipped
• Edge: Mixed public signals
• Safari: Shipped
• Web Developers: No signals

Owner

• xing.xu@intel.com

Last updated on 2017-06-21