Setting the correct orientation for scrollbars in right-to-left pages.
- by Daniel Lew
I'm working with right-to-left layouts at the moment (think Hebrew or Arabic). In RTL, the page is generally flipped horizontally. However, I can't figure out how to change the orientation of the scrollbars. I would assume that the scrollbars should appear on the left side of a scrollable element, not the right side like it does in an LTR layout.
Here is an example page where the scrollbar still appears on the right:
<html dir="rtl">
<body>
<div style="height: 100px; overflow: auto;">
<p>This is some text</p>
<p>This is some text</p>
<p>This is some text</p>
<p>This is some text</p>
<p>This is some text</p>
</body>
</html>
Is the orientation of a scrollbar a browser locale setting, and thus is not something I should be concerned about, or is there a way to set the orientation of the scrollbar?
(I'm not interested in implementing my own JavaScript scrollbar; if it turns out this is just a limitation of browsers then I'd rather live with that than add complexity to the page.)
