Prevenir Google Traductor de cambiar la altura de html en 100%

Question

que añade un widget de Google Translator para un sitio (utilizando el código proporcionado aquí: http://translate.google.com/translate_tools) y tienen el siguiente problema:

Se añade automáticamente un atributo de estilo a la etiqueta html cuyo valor incluye:

height: 100% 

Esto "rompe" el diseño de la página. Por ejemplo, las imágenes de fondo de CSS que se colocaron en "abajo" ahora están ubicadas (incorrectamente) en la parte inferior del puerto de visualización.

¿Hay alguna forma de prevenir o solucionar esto?

Answer 1

Pude resolver esto estableciendo el atributo min-height del cuerpo en css como! Important para evitar la anulación.

body { 
min-height: 0 !important; 
} 

ACTUALIZACIÓN - Por desgracia, esto ya no funciona. La secuencia de comandos de Traducción de Google eliminará cualquier intento que realice para contrarrestar su estilo de altura mínima. Tengo el CSS anterior en mi hoja de estilo Y un estilo en línea en la etiqueta del cuerpo.

La secuencia de comandos de la Traducción de Google es bastante agresiva y no veo ninguna forma de desactivar esto.

Answer 2

Tal vez es como

cuerpo {height: automático importante; }

Answer 3

no escriba css en la parte de la cabeza, escriba en un archivo css. esto evitará la traducción automática por google.

Answer 4

Intenté utilizar las soluciones proporcionadas por las otras respuestas, pero no funcionaron para mí. Si alguien más tiene este problema, tuve éxito con this solution.

body { position:static !important; min-height:100%; top:0; } 

Answer 5

he encontrado una manera de resolver este problema, que no es a prueba de balas, pero supongo que funciona por ahora:

Plugin:http://darcyclarke.me/dev/watch/

con este código :)

$(window).load(function(){ 
     $('body').watch('min-height', function(){ 
      var style = parseInt($('body').css('min-height')); 
      if(style > 0){ 
       $('body').css({ 
       'min-height' : '0', 
       'position' : 'static', 
       'top' : 'none' 
       }); 
      } 
     }); 
}); 

Answer 6

La única forma en que puedo ver para combatir esto es poner un tiempo de espera de 500 ms en el código para restablecer la propiedad de min-height del cuerpo. Si no te molesta que tu página salte un poco durante medio segundo con la carga, funciona. Usando jQuery, se vería algo como esto:

$(function(){ 
    var myMinHeight = 950; 
    setTimeout(function(){$('body').css('min-height',myMinHeight)},500); 
}); 

establecer el valor de myMinHeight a lo que usted desea que sea.

Answer 7

esto resuelve el problema:

/* Google Translate Overrides */ 
html, body{ 
    min-height: 0!important; 
    height: auto!important; 
    position: inherit!important; 
} 

Answer 8

esto debería funcionar:

html { 
 
    height: auto !important; 
 
} 
 

 
body { 
 
    position: initial !important; 
 
    min-height: initial !important; 
 
    top: auto !important; 
 
}