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 thread is resolved. Here is a description of the problem and solution.

Problem:
I am trying to adjust the size of the dropdown language switcher and have the white space removed.

Solution:
You can fix this issue by adding the following CSS in your theme’s or child theme's style.css file OR Custom CSS section of the theme:

.wpml-ls-item .sub-menu-dropdown {
    width: auto !important;
}

.wpml-ls-item ul li a {
    padding: 0 12px !important;
}

This topic contains 5 replies, has 2 voices.

Last updated by Daniel Toma 5 months, 2 weeks ago.

Assigned support staff: Noman.

Author Posts
May 2, 2019 at 2:22 pm #3725577

Daniel Toma

I am trying to: adjust the size of the dropdown language switcher and have the white space removed

Link to a page where the issue can be seen: hidden link

I expected to see: at least same as on hidden link

Instead, I got: what iti is now on hidden link the flag and a lot of white space on the right side
Would be nice also if the flags could be a little bigger, specially on mobile devices.

May 2, 2019 at 2:26 pm #3725609

Daniel Toma

On the other site that I have this code workedȘ
.wpml-ls-item .second .inner ul li {
width: 60px !important;
text-align: center !important;
margin: 0 !important;
}

.wpml-ls-item .second .inner ul li a {
padding: 0 !important;
}

Here on this one is not working. Have tried a lot of them but didn't managed to make it work.

May 2, 2019 at 4:13 pm #3726673

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi,

Thank you for contacting WPML Support. You can fix this issue by adding the following CSS in your theme’s or child theme style.css file OR Custom CSS section of the theme:

.wpml-ls-item .sub-menu-dropdown {
    width: auto !important;
}

.wpml-ls-item ul li a {
    padding: 0 12px !important;
}

And it will look as in attached screenshot.

Thank you

May 2, 2019 at 4:43 pm #3727157

Daniel Toma

The drop down size is ok now! Thank you!
One more question before closing the ticket: is there a way to make the flags bigger?

May 2, 2019 at 4:50 pm #3727245

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi,

If you want to use larger flags then please follow below steps:

1. Upload your flag images to WPML >> Languages >> Edit Languages >> Custom Flag option. This will upload your files, but resize them to 18x12

2. To resize flag dimensions then with FTP program, go to wp-content/uploads/flags and upload your flag images again, overwriting the flag images that were uploaded in Step #1

3. In your custom CSS, add this code:

.wpml-ls-menu-item .wpml-ls-flag {
  height: auto !important;
  width: auto !important;
}

Thank you

May 2, 2019 at 4:52 pm #3727273

Daniel Toma

My issue is resolved now. Thank you!