Hacer zoom en Chrome causa problemas de posicionamiento de CSS

Question

Cuando acerca y aleja mi página web en Google Chrome, los elementos que están posicionados con precisión uno en relación con el otro cambiarán de posición. Esto causa muchos problemas: por ejemplo, a niveles de zoom específicos, un div se superpondrá a su div que contiene lo suficiente como para ocultar un borde. De manera similar, a veces un marcador de 100% no se alineará con precisión con el punto de 100%.

¿Hay alguna manera de garantizar que el posicionamiento de los elementos entre sí no cambie cuando la página se acerca o aleja?

Answer 1

Puede usar el posicionamiento em, que se reubicará y dimensionará en función del tamaño de la fuente. Entonces, cuando a las personas les gusta controlar + o mandar +, la página cambiará de tamaño automáticamente. Aquí hay una página sobre diseños elásticos. Espero que esto ayude.

http://v1.jontangerine.com/log/2007/09/the-incredible-em-and-elastic-layouts-with-css

Answer 2

En mi experiencia, el uso de un valor left: píxeles y un valor top: px comparación a derecha/izquierda inferior/inferior o/superior derecha parece hacer el truco. Esto se aplica tanto a Chrome como a FF, no puedo comentar sobre IE.

Por ejemplo:

#my-element 
{ 
    list-style-type: none; 
    position: fixed; 
    left: 54px; 
    top: 40px; 
} 

Answer 3

Aunque se trata de un viejo tema, me encontré con este problema. Se corrigió añadiendo contenedores a los elementos "elusivos". Por lo tanto, antes de tratar de corregir el elemento css, tal vez verifique y asegúrese de que el contenido esté primero.