This thread is resolved. Here is a description of the problem and solution.
Problem:
The client reported that the WPML language switcher on their website had a wrong appearance, with flags overlapping in the dropdown menu, and was unsure if it was due to a WPML update or a theme update.
Solution:
We identified that custom CSS was affecting the WPML language switcher's appearance. We provided a snippet of custom CSS for the client to add to their site to correct the issue. The client should navigate to the WordPress backend, go to Appearance > Customizer > Custom CSS, and then add the following code:
.w-dropdown-list-h a {
margin-top: 15px !important;
}
.w-dropdown-list-h a:first-of-type {
margin-top: 0px !important;
}
.w-dropdown-list {
padding-top: 2em !important; }
We also mentioned that while this type of issue is usually considered custom work and falls outside our Support Policy, we try to help our customers with quick fixes when possible. For more complex issues, we recommend hiring a WPML contractor or a front-end developer.
If this solution doesn't look relevant, please open a new support ticket.
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 1 reply, has 2 voices.
Last updated by 1 year, 5 months ago.
Assisted by: Mihai Apetrei.
 |
Hi, On my website hidden link my WPML language switcher has wrong appearance and flags of my languages almost overlap each other at dropdown menu. Is this maybe a bug of 4.6.8 WPML Multilingual CMS or is it related with my latest theme update? Thank you in advance,  |
 WPML Supporter since 03/2018 Languages: English (English ) Timezone: Europe/Bucharest (GMT+03:00) |
Hi there. Yes, it seems that there is some custom CSS that is overwriting the normal behavior of WPML. But no worries, I wrote this quick custom CSS for you that you can add to your site's backend to Appearance > Customizer > Custom CSS > add it and save:
.w-dropdown-list-h a {
margin-top: 15px !important;
}
.w-dropdown-list-h a:first-of-type {
margin-top: 0px !important;
}
.w-dropdown-list {
padding-top: 2em !important; }
This should make things look a bit better as shared in my screenshot below. This type of work usually is considered custom work and it falls out of the purpose of our Support Policy but if it's something quick, we try to give a little extra to our customers 🙂 When it is something that takes more work, then we recommend hiring a WPML contractor (https://wpml.org/contractors) or a front-end developer. I hope that you will find the code helpful 🙂 Mihai Apetrei  |
