Привычные CSS-свойства для отступов, бордеров и размеров привязаны к экрану: margin-left, padding-top, border-right, width. Это работает, пока сайт показывает только горизонтальный текст слева направо. Стоит появиться арабскому интерфейсу, заголовку с writing-mode: vertical-rl или просто RTL-блоку с цитатой — и стили начинают вести себя не так, как нужно.
В современном CSS есть отдельная группа свойств, которая решает эту проблему. Они описывают позиционирование не в координатах экрана («слева/справа/сверху/снизу»), а в координатах текста: вдоль строки и поперёк неё. Те же стили автоматически разворачиваются вместе с языком документа — никаких отдельных правил для RTL.
Эти свойства называются логическими, и в этом мануале мы подробно их разберём. Семь глав — от концепции и до сводной шпаргалки. После каждой главы — вопрос в финальном тесте, чтобы можно было проверить, что усвоилось. По дороге будут CodePen-демо там, где разница лучше видна вживую.