-
Hi,
The background seems to show on the wrong end on rtl site.
Please check video – https://drive.google.com/file/d/1VlOe69SNZ1AsoLahsudqGe3X1z1OYQOW/view?usp=drive_link
For the Arabic site the background needs to be behind the image.
Regards
-
Hi there,
hmmm…. tricky one as the background is a linear gradient and thats pure CSS so it will not respond to RTL.
You could try this:1. Select the Container Block that has the Gradient Attached to it:
1.1 set the gradients SELECTOR to Pseudo Element.
1.2 In Advanced > Additional CSS Classes add:has-gradientSave that
2. In your CSS add this:
[dir='rtl'] .gb-container.has-gradient:after { transform: scaleX(-100%); }What that should do is flip the pseudo element on a RTL site.
But you will have to do that for every container that has the gradient.
-
Hi,
Is there an easier way to do this, I am not so good with coding.
-
There isn’t unfortunately.
The only code required is part 2. Which you can copy and paste into the Customizer > Additional CSS at the very top. -
Thank you. I followed the steps, it almost fixes the issue. The styling of image is still not right on RTL. There needs to be an empty space before the image.
-
OK, the only way to resolve that would be to change the design so that Container Block has equal Left and Right Padding….
- You must be logged in to reply to this topic.