Floating Language Bar Custom CSS required

  • Resolved MisterH

    (@hmarksthespot)


    4 years, 3 months ago

    Hello, We are using the Ocean WP Theme.

    We placed the floating bar on top and The floating bar interferes with the social icons. So we are using the code below to move it more towards the center on a desktop.

    But on mobile view it is a bit messy,

    1. We want to adjust the size itself of the selection box as well as the text inside, reduce the top and bottom padding and such to make it appear right.

    2. One for mobile the other for tablets – is this code okay or can you improve it?

    /* Translatepress Language Floater Position */
#trp-floater-ls{ left: 95% !important}

@media screen and (max-width: 800px) {
#trp-floater-ls {
left: 0%
!important}
}

    any help appreciated

    • This topic was modified 4 years, 3 months ago by MisterH.
Viewing 1 replies (of 1 total)
  • Andrei

    (@andrei202)

    4 years, 2 months ago

    Hey there,

    Thanks for reaching out to us!

    We deeply apologize for the delayed response.

    There has been a great load on our support team in the past few days, but such a long reply time is very uncommon.

    You can try to add the following CSS code:

    @media screen and (max-width: 800px) {

.trp-language-switcher-container:not(#trp-floater-ls){
margin-left: 70% !important;
}

.trp-ls-shortcode-current-language {
width: 100px !important;
font-size: 75% !important;
}

.trp-ls-shortcode-language {
width: 100px !important;
font-size: 75%!important;
}

}

    You can change the values to better work with your site.

    Let me know if you have any further questions.

    Regards

Viewing 1 replies (of 1 total)

The topic ‘Floating Language Bar Custom CSS required’ is closed to new replies.