diff --git a/src/docs/text-align.mdx b/src/docs/text-align.mdx index eae2a7127..c2dc65e7d 100644 --- a/src/docs/text-align.mdx +++ b/src/docs/text-align.mdx @@ -130,3 +130,55 @@ Use the `text-justify` utility to justify the text of an element: ### Responsive design + +### Using logical properties + +Use the `rtl` variant to conditionally add styles for both right-to-left and left-to-right, when building multi-directional layouts: + +```html + +

So I started to walk into the water...

+``` + +Alternatively, you can use the `text-start` and `text-end` logical utilities, to let the browser align the text either the left or right side based on the writing direction: + +
+ + + { +
+
+

Left-to-right

+
start
+
center
+
end
+
+
+

Right-to-left

+
start
+
center
+
end
+
+
+ } + + +```html + + + +
+
+
start
+
center
+
end
+
+
+
start
+
center
+
end
+
+
+``` + +