Skip to content
CSS·Intermediate·Output based·1 min read

What are logical properties useful for?

Short interview answer

Properties such as margin-inline and padding-block express layout relative to writing mode rather than left/right assumptions. They make components more adaptable to right-to-left and vertical writing systems.

Example

CSS
.card {  padding-inline: 16px;  /* left/right in LTR, right/left in RTL */  margin-block: 8px;     /* top/bottom */  border-inline-start: 2px solid; /* the "leading" edge */}

Key takeaway

Explain the underlying mental model clearly, then support it with a concrete example and its trade-offs.

← Back to Responsive design and container queries

Related questions