Google Translate удаляет CSS - PullRequest
       5

Google Translate удаляет CSS

3 голосов
/ 22 ноября 2011

Я добавил приложение googles translate на сайт, используя следующий код

<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'en',
    autoDisplay: false,
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}

</script><script src="//translate.google.com/translate_a/element.js?
cb=googleTranslateElementInit"></script>

Приложение работает на нескольких языках.При переводе на другие языки все CSS удаляются.

Я слежу за конкретными элементами (такими как li в заголовке или div), а затем запускаю перевод.Я вижу, что ни сценарии заголовка (т.е. CSS), ни элементы не изменяются приложением.Просто стили долго не применяются (firebug говорит мне: «У этого элемента нет правил стиля»)

Проблема возникает в Firefox, но не в Chrome или Opera.Вот?

afrikaans tranlsation french translation

Ответы [ 2 ]

2 голосов
/ 23 ноября 2011

В случае, если у кого-то еще есть такая же проблема -

php, который сжимает файлы css, добавляет заголовок к сценариям, поэтому

<link title="Default" media="screen" type="text/css" href="/modules/pd_smoothgallery/jd.gallery.css" rel="stylesheet">

был изменен на

<link title="Par défaut" media="screen" type="text/css" href="/modules/pd_smoothgallery/jd.gallery.css" rel="stylesheet">

Я удалил название, и перевод отлично работает для всех языков.

(не уверен, почему firebug не выделил это изменение, но это не так).

0 голосов
/ 19 марта 2019
#google_translate_element span{
     color:white!important;
     font-size:15px;
     border-left:1px solid transparent!important;
     line-height: 22px;
 }  
 .goog-te-gadget-simple {
    background-color: #5191CD !important;
     border-left: 1px solid transparent !important; 
     border-top: 1px solid transparent !important; 
    border-bottom: 1px solid transparent!important; 
    border-right: 1px solid transparent !important;
 } 
 .goog-te-gadget-icon {
     margin-left: 0px; 
     margin-right: 0px; 
    width: 0px!important; 
     height: 0px !important; 
    border: none; 
     vertical-align: middle; 
}    

...