Google Translate Eliminating Space in Select

Question

Is it possible to cut out the white space from the google translate select when you choose a language. In my example if you choose spanish you will see a lot of extra space but is it possible to shrink the select and remove the extra spacing so that it just is the size of the word maybe with just a little extra spacing on the sides like 2px or so?

Since I am using google translate I am not able to create an id I have to use the values that are given with google translate?

$(document).ready(function() {
 $('.goog-te-combo').change(function(){
    $(".goog-te-combo").html($('.goog-te-combo option:selected').text());
    $(this).width($(".goog-te-combo").width());  
 });
});

http://jsfiddle.net/bobrierton/5c1vbo2s/13/

<div id="google_translate_element"></div>                              

<script type="text/javascript">
            function googleTranslateElementInit() {
                new google.translate.TranslateElement({
                    pageLanguage: 'en', 
                    layout: google.translate.TranslateElement.InlineLayout
                }, 'google_translate_element');
            }
        </script>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit">
</script>

Possible duplicate of [Auto resizing the SELECT element according to selected OPTION's width](http://stackoverflow.com/questions/20091481/auto-resizing-the-select-element-according-to-selected-options-width) — sandeep s, Dec 10 '15 at 19:26
@sandeeps where im lost is I cannot figure how to get the options for google translate since I am not creating it — David Brierton, Dec 10 '15 at 19:31
@sandeeps any chance u can see where I am going wrong this is my exact code http://jsfiddle.net/bobrierton/5c1vbo2s/16/ — David Brierton, Dec 10 '15 at 20:10
To be honest this is the second time someone has told me that. :/ Have you added the HTML and CSS from the fiddle? — sandeep s, Dec 10 '15 at 20:10
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/97560/discussion-between-sandeep-s-and-david-brierton). — sandeep s, Dec 10 '15 at 20:27

score 1 · Accepted Answer · answered Dec 10 '15 at 20:16

1

You had forgotten to close the ul tag. Here is the updated fiddle

jQuery selectors are pretty neat, take a look at them here

In my case i have used the class selector.

answered Dec 10 '15 at 20:16

sandeep s

385
2
8

only in the fiddle lol but that's still not working its not cutting out the white space if u chose a language – David Brierton Dec 10 '15 at 20:17
But it is reducing the size and showing the selected language? – sandeep s Dec 10 '15 at 20:20
if you select Spanish the arrow should be a couple pixels after, then if you select Chinese traditional it does not fit either – David Brierton Dec 10 '15 at 20:24
Lets continue on [chat](http://chat.stackoverflow.com/rooms/97560/discussion-between-sandeep-s-and-david-brierton) – sandeep s Dec 10 '15 at 20:28

Google Translate Eliminating Space in Select

1 Answers1