Skip Navigation

Home › Support › English Support › [Closed] Divi: CSS settings different on translated page

[Closed] Divi: CSS settings different on translated page

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.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 14:00 9:00 – 14:00 9:00 – 14:00 9:00 – 14:00 9:00 – 14:00 -
- 15:00 – 18:00 15:00 – 18:00 15:00 – 18:00 15:00 – 18:00 15:00 – 18:00 -

Supporter timezone: Asia/Dhaka (GMT+06:00)

This topic contains 1 reply, has 2 voices.

Last updated by Prosenjit Barman 1 year ago.

Assisted by: Prosenjit Barman.

Author Posts
May 13, 2024 at 11:24 am #15620443

Mandy

Hello, I'm trying to figure out why some CSS definition in the Divi theme is different on the translated pages. Here an example:

This is the correct formatting on the original language:
German: hidden link

.et_pb_gutters3 .et_pb_column_3_4 .et_pb_module, .et_pb_gutters3.et_pb_row .et_pb_column_3_4 .et_pb_module {
margin-bottom: 3.735%;
}

And on the translated page the margin-bottom is set to 0 and I don't understand why and how (page is translated using WPML, so the design should be 100% identical to the original version):

EN: hidden link

.et_pb_gutters1 .et_pb_column_3_4 .et_pb_module, .et_pb_gutters1.et_pb_row .et_pb_column_3_4 .et_pb_module {
margin-bottom: 0;
}

Do you have any idea how this is happening and how to fix it?

Thank you!
Mandy
May 14, 2024 at 8:15 am #15623818

Prosenjit Barman
WPML Supporter since 03/2023

Languages: English (English )

Timezone: Asia/Dhaka (GMT+06:00)

Hello Mandy,
Thanks for contacting WPML Support.

I understand the issue you're having. If the style adjustment is made in the Divi Editor, the same style should be copied over to the translation. However, if you've added the style by defining custom CSS, the CSS rule may not be copied over to the translation.

In such cases, you need to add the language selector property at the beginning of the CSS. Within the selector, include the language code for which the CSS will apply. Please check the example CSS below:

//"en-US" is the language code for English. If you inspect the English page, you'll see that in the lang attribute of HTML tag
html[lang="en-US"] .et_pb_gutters1 .et_pb_column_3_4 .et_pb_module, .et_pb_gutters1.et_pb_row .et_pb_column_3_4 .et_pb_module {
margin-bottom: 3.735%;
}

But if the style adjustments are made within the Divi editor, you may need to make a small change in the default page or post and then update the translation so that any changes can copied over to the translation correctly.

Please let me know the update. I will be happy to help if you need further assistance in this matter.

Best regards,
Prosenjit

The topic ‘[Closed] Divi: CSS settings different on translated page’ is closed to new replies.