Skip to content


Subversion checkout URL

You can clone with
Download ZIP


RTL major issue: Page width increases in RTL pages #1056

ShockShadow opened this Issue · 6 comments

4 participants



The page width gets too much increased in case of an RTL page. You can also directly investigate this issue by switching the page direction ( Firefox -> View -> Switch Page Direction ).

The following CSS style caused the issue:

body {direction: rtl}

I could temporarily solve it by using the following CSS:

body {direction: ltr}
div#container {direction: rtl}

I attached an image for the issue (Look at the scroll bar in the attached image)
Chosen Issue

Chosen version: 0.9.11
Chosen plugin version: jQuery
Browser: Firefox 18.0.1
OS: Windows XP SP2


Apply the chzn-rtl class on your select


I have already done that. The issue is still persisting.


note that this class has to exist on the select at the time where chosen is initialized, so that it does the initialization in RTL mode


Again, I edited the file (example.jquery.html) and added the chzn-rtl class to all Chosen selects. Nothing changed except the Chosen itself is rendered in the RTL direction. The page is still affected!

When I scrolled to the far left, I noted that the Chosen drop menu element is not hidden, but it is moved too far to the left (On blurring the Chosen select), so it causes that behavior for the page.


I have the same problem , and applying the chzn-rtl class does nothing to resolve this specific issue (only align fields to right). The problem comes from the -9000 left margin which is hardcoded in the JS file. There is however a pull request that handles that problem.


Duplicate of #447

@pfiller pfiller closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.