Vertical Right-to-Left Text with Mixed Orientation and 180-Degree Rotation

Explore our CSS category, where you’ll find loads of helpful articles and tutorials for everyone, whether you’re just starting out or a pro developer. Learn about different CSS styles and techniques that can be applied in various projects according to their specific requirements.

The CSS code snippet writing-mode: vertical-rl; text-orientation: mixed; transform: rotate(180deg); is a combination of properties used to create vertical text layouts in web design.

writing-mode: vertical-rl;
text-orientation: mixed;
transform: rotate(180deg);
writing-mode: vertical-rl;: sets the writing mode to vertical, allowing text and inline-level elements to flow vertically from right to left.

Text-orientation: mixed; specifies that the text can have a mixture of horizontal and vertical orientations within the same line.

transform: rotate(180deg); rotates the text by 180 degrees, ensuring proper alignment and orientation when displayed vertically.

When combined, these properties enable developers to implement vertical text layouts effectively, adding a unique and visually appealing element to web designs.