If you're experiencing layout issues on your translated pages with WPML and Elementor, such as too much padding on the sides, it's possible that certain CSS adjustments are not being applied to the translated versions.

First, ensure that all pages and templates are fully and accurately translated. Then, to correct the layout, apply custom CSS for the translated versions. You can add the following code to the "Appearance > Customize > Custom CSS" section of your site: <code>html[lang="en-US"] .ast-container, html[lang="de-DE"] .ast-container { max-width: 100% !important; padding: 0 !important; }</code> This CSS will adjust the width and padding for the translated pages. Replace \'en-US\' and \'de-DE\' with the language codes relevant to your site. If this solution doesn\'t look relevant, please <a href="https://wpml.org/forums/forum/english-support/">open a new support ticket</a>.

Layout changed translated pages

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.

Tagged: Exception

This topic contains 1 reply, has 2 voices.

Last updated by Prosenjit Barman 1 year, 2 months ago.

Assisted by: Prosenjit Barman.

Author	Posts
December 4, 2023 at 1:20 pm #14987133
jeffreyB-17	Hi, I have translated my website with WPML and now the layout of the translated pages is not looking good. I use Elementor and the translations are all good, but for the translated pages the layout is wrong. There is too much padding on each side of the page. What is going wrong and what can we do to make it look good (like the normal version)? Kind regards, Jeffrey
December 5, 2023 at 9:17 am #14994593
Prosenjit Barman Supporter Languages: English (English ) Timezone: Asia/Dhaka (GMT+06:00)	Hello Jaffrey, Thanks for contacting WPML Support. I have checked the Translated version of the Homepage and understood the issue. Upon review, I discovered that certain CSS adjustments made to the width and padding in the default version are not present in the translated version of the layout. I also noticed that several classes are missing in the translated layout, which is likely responsible for the discrepancies in appearance compared to the default page. Please verify that the pages have been thoroughly and accurately translated into other languages. Additionally, if you're using templates for these pages, ensure that these templates are translated too. To address this issue, you can apply CSS specifically for the translated versions of the pages. For instance, consider adding the CSS code to the "Appearance > Customize > Custom CSS" section of your site to achieve the desired layout and appearance. html[lang="en-US"] .ast-container, html[lang="de-DE"] .ast-container { max-width: 100% !important; padding: 0 !important; } Let me know the update. I will be happy to help if you need further assistance in this matter. Best regards, Prosenjit