Vasseurth Vasseurth - 11 months ago 117
CSS Question

Can you style the google translate plugin?

I'm using this plugin ( to translate my website.
The problem is that I can't figure out how to style it so it does not fit with the rest of the page.

Any suggestions?


Sure you can style anything that renders out on your page.

Here is a part of the rendered mark-up:

<div id="google_translate_element">
  <div class="skiptranslate goog-te-gadget" style="">
    <div id=":1.targetLanguage">
    <select class="goog-te-combo">
Powered by
  <span style="white-space: nowrap;">


You can take a look at what goog-te-combo renders out and override it with your own styles like this:

    .goog-te-gadget {
        font-size: 19px !important;

Depending on what it is exactly that you want to change this method can be used for any of the styles rendered out in their classes or to extend them.