Logical properties
This card has an accent border on the reading-start edge, a gap before the sidebar, and text aligned to where reading begins. Watch which edge each one clings to.
A sidebar and a content card with an accent border, a gap, and left-aligned text. Switch the layout to
RTL (Arabic, Hebrew, Persian) while using physical CSS
(margin-right, border-left, text-align: left) — everything stays glued to the
wrong edge. Switch to logical CSS and it mirrors automatically. Same rules, both directions.
This card has an accent border on the reading-start edge, a gap before the sidebar, and text aligned to where reading begins. Watch which edge each one clings to.