Search code examples
csswordpresswordpress-themingright-to-left

Why my page is too wide when using RTL?


This is a WordPress issue and I'm asking this question here because I believe it is a CSS problem.

I'm using Wordpress and a theme named ShootinStar but I have to do my website in an RTL language. The theme supports RTL though.

Everything is perfect when the language of WordPress is English but once I change it to Farsi, then the width of my theme increases by maybe 4 times.

The website is visible and clear but you can actually swipe to left and see the rest of the background in a wide area.

Pages are fine, no problems with that. But the 'Post page' where I do my blogging which is my main page, is facing this issue. I tried assigning it to a page, but then that page will have the same problem.

I tried disabling plug-ins and changing themes, but nothing happened. I'm guessing that it is a CSS problem, but where is it exactly? I attached screenshots and highlighted the parts with red arrows.

This is after using element inspector:

What shall I do?!


Solution

  • You can add this CSS code to remove the unwanted space in the x-axis direction.

    #container {
      overflow-x: hidden;
    }