Google翻訳するウィジェットモバイルオーバーフロー

Question

Googleの翻訳プラグインに問題があります。デスクトップモードでは問題なく表示されますが、モバイルに移行すると、ドロップダウンの幅がブラウザの幅を超えます。

これが起こらないようにするにはどうしてですか？

よろしく

Answer 1

、あなたが翻訳し、ドロップダウンCTAをクリックした後、それを追加する必要が存在しない要素にCSSを追加することができないので。このjqueryは私のために働く。

$('body').click('#google_translate_element', function() { 
    if (($goog = $('.goog-te-menu-frame').contents().find('body')).length) { 
     var stylesHtml = '<link rel="stylesheet" href="/css/google-translate.css">'; 
     $goog.prepend(stylesHtml); 
    } 
}); 

このCSSでは、

.goog-te-menu2 { 
    width: 300px!important; 
    height: 300px!important; 
    overflow: auto!important; 
} 
.goog-te-menu2 table, 
.goog-te-menu2 table tbody, 
.goog-te-menu2 table tbody tr { 
    width: 100%!important; 
    height: 100%!important; 
} 
.goog-te-menu2 table tbody tr td { 
    width: 100%!important; 
    display: block!important; 
} 
.goog-te-menu2 table tbody tr td .goog-te-menu2-colpad { 
    visibility: none!important; 
}