Skip Navigation

This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

This topic contains 3 replies, has 3 voices.

Last updated by Bobby 1 year, 1 month ago.

Assisted by: Bobby.

Author Posts
October 19, 2023 at 9:22 am #14613073

Atiq Rahman

Hi,

I have facing some issue with my arabic csss. like - for every translate design i'm using like below CSS.

html[lang="ar"] .callto{
text-align: right;
margin-right: 30px;
}
html[lang="ar"] .footerbottomcare i {
margin-left: 10px;
}

I have try SCSS like below But it not supporting every browser.

html[lang="ar"]{
.callto{
text-align: right;
margin-right: 30px;
}
.footerbottomcare i {
margin-left: 10px;
}
}

Is there any good solution for easy way to design all at one variable?

Thank you

October 19, 2023 at 10:24 am #14613711

Dražen Duvnjak
Supporter

Languages: English (English )

Timezone: Europe/Zagreb (GMT+01:00)

Hello,

While WPML lets you easily translate your content into RTL languages, it doesn’t control the RTL layout of your theme. The display of right-to-left content is determined by the CSS rules of your WordPress theme.

If your theme and the plugins on your site come with RTL support for layouts, WPML applies the correct formatting to your site’s translations.

I would advise checking further with your theme support and making sure they support RTL or hire a contractor for custom coding service.

Other then that only way would be you add CSS rules each time as you are doing it now.

Please check the related docs:

- https://wpml.org/faq/does-wpml-have-rtl-support-right-to-left/
- https://wpml.org/documentation/theme-compatibility/build-rtl-wordpress-themes/

Regards,
Drazen

October 19, 2023 at 11:54 am #14614539

Atiq Rahman

Hi,

I'm using rehub them already they have this feature. rlt.css

but when i try to do my own code it not working, i mean on my custom.css file codes.
My Question is is there any option to do style formally only for ar?

Thank you

October 20, 2023 at 5:16 am #14620501

Bobby
Supporter

Languages: English (English )

Timezone: America/Los_Angeles (GMT-08:00)

Hi there,

The CSS language attribute you are using html[lang="ar"] is a correct way of targeting language only for CSS.

WPML does not have a specific feature for this, you could if the theme allows you to add custom CSS directly in the page builder for a specific page but that would be page-level CSS and not for the entire site.

You could also use the lang() selector for CSS, see here:
hidden link).