[Resolved] Custom CSS for language Switcher

Problem:
The client is using WPML with Brick Builder and has added two language switchers using WordPress shortcodes. They want to customize the CSS for these switchers but are having trouble overriding the existing WPML CSS.

Solution:
We recommended using the

!important

declaration in their custom CSS to ensure that their styles have higher priority over the default WPML styles. For example:

.wpml-ls-legacy-dropdown a {<br />color: #f1f1f1 !important;<br />background-color: transparent !important;<br />}

We also explained that WPML, like any other plugin or theme, has its own HTML IDs and Classes that can be targeted with custom CSS to modify the design. The

!important

declaration is a common method to override existing styles when they are not being applied due to lower specificity or conflicts with other styles.

If this solution does not apply to your case, or if it seems outdated, we highly recommend checking the related known issues, verifying the version of the permanent fix, and confirming that you have installed the latest versions of themes and plugins. If you still encounter issues, please do not hesitate to open a new support ticket. You can reach our support forum here.