[Resolved] Language Switcher style (css)

Hello @ioannac,

Could you please share the URL of your website where I can see the issue? This will help me spot the CSS class that you need to modify to have your flags closer to each other.

In the meantime, please try to use "!important" for the CSS rules you are overwriting. Make sure that the menu on all pages uses the same classes. It's possible that you have a different menu with different classes that you need to modify your CSS rules for.

Can you also please share the debug information? You will find the required information in WPML->Support->Debug Information. Please copy the info from the 'debug info' box and paste it in your next reply (it will be private).

Hello @ioannac,

Please try the following:
1. Go to WPML->Languages.
2. Scroll down to the" Language switcher options" section.
3. Add the following code to the "Additional CSS" field:

#header-menu li.wpml-ls-menu-item {
    margin-top:  0 !important;
    margin-left:  10px !important;
}

4. Save changes.

If you want to have more space between normal menu items and the language switcher, use the following code:

#header-menu li.wpml-ls-menu-item:not(.wpml-ls-first-item) {
    margin-top:  0 !important;
    margin-left:  10px !important;

Hello @ioannac,

If you have a similar field (additional CSS) in your theme options, try to add the code there. If not, you may need to edit the theme's original CSS file.

Additionally, if you have any cache on your server, please clear it. Also, always check your website in the browser's incognito mode to make sure that it's not the browser's cache issue.

You may also try to add the mentioned rules to the specific IDs, e.g.:

#menu-item-wpml-ls-medartclinicmenu-el, #menu-item-wpml-ls-medartclinicmenu-ru {
    margin-top:  0 !important;
    margin-left:  10px !important;
}

#menu-item-wpml-ls-medartclinicmenu-en {
    margin-top:  0 !important;
}

However, you need to remember that these IDs may change if you change anything in your menu or language switcher.

If you still can't force additional CSS rules to work, I'd recommend you contact your theme's authors and ask them which classes should you overwrite to have it work.