I have a content block that includes text in both left-to-right and right-to-left languages, and I need to ensure that both display correctly.
- If the user begins with left-to-right text, it should be displayed from left to right with left alignment
- If the user begins with right-to-left text, it should be displayed from right to left with right alignment
I would like to achieve this using only CSS.
My initial thought is to use something like this, but unfortunately there is no 'direction Auto' property:
.content {
direction: auto; // will switch direction based on language
text-align: auto;
}