display: div; direction: rtl;... screwing up certain characters: !?. etc.

**molendijk** · 06-13-2018, 01:50 PM

I've done some research on the matter and found that punctuation marks are placed to the left of the text (when the writing direction is right-to-left) because that's their correct position for languages written right to left (like Hebrew). When you want them to the right of the text, just add &lrm; to the end of the word, after the punctuation mark. See also https://dotancohen.com/howto/rtl_right_to_left.html
So gib65's original code should have been:

Code:

<html>
<head></head>
<body>
<center>
<div style="width: 100px; margin: auto; display: flex; direction: rtl; background-color: pink;">
<span style="margin: auto;">Hola!&lrm;</span>
</div>
</center>
</body>
</html>