Re: Zoom para valor 110% funciona con error

Esta página web es un archivo de los hilos antiguos de los foros de Google. Más información

harmless

3/05/13 20:16

iouriK, buenos,

¿Qué tipo de errores? Como navegador se bloquea, o algo así?

Respuestas (4)

iouriK

4/05/13 6:27

Hola.

Los imagenes hechos por css con el uso de pseudos before and after se muestran por distinta manera depende de Zoom: 100% - muestra correcto, 110% - muestra inaceptablemente mal, 120% muestra correcto, 130% muestra mal, pero aceptable, 140% - correcto, y asi mas.

Sin embargo cuando hago lo mismo sin before and after (los divido y uso top y left) todo sale bien con cualquier Zoom.

Hoy mas tarde voy a preparar y poner aca ejemplo.

Gracias.

iouriK

4/05/13 9:05

Hola, harmless.

En el adjundo hay archivo html con el ejemplo y dos imagenes para casos de zoom 100% y 110%.
Para el caso de 110% hay dos problemas. Una se ve claramente. Y la otra es que el texto "FORWARD" pasó por abajo. Para este ejemplo Zooms a partir de 125% sin problemas.

La versión del Chrome es
26.0.1410.64 m

Gracias.

harmless

4/05/13 19:24

iouriK,

Las imágenes no se usa el zoom al mismo tiempo con la función de zoom. Pixels no ponerse al día.

¿Ha actualizado el sistema operativo con controladores de gráficos y todo eso?

iouriK

5/05/13 10:12

harmless.

Aca está el codigo del archivo html:
***************************************
<html>
<head>
<style>
.btnForward{
        width: 0; height: 0;
        display: inline-block;
        position: absolute;
        border-top: 7px solid transparent;
        border-bottom: 8px solid transparent;
        border-left: 8px solid #436C9A;
        left:160px;
        top:9px;
}
.btnForward:before{
        position: relative; display: inline-block;
        height:18px;
        display: inline-block;
        background: #436C9A;
        color:#C8D3E6;
        text-align: center;
        font-weight: 500;
        font-size: 17px;
        font-family: georgia;
        text-shadow : 0px -1px 0px black;
        width:93px;
        content: "FORWARD";
        -webkit-border-top-left-radius : 6px 6px;
        -webkit-border-bottom-left-radius : 6px 6px;
        -webkit-border-top-right-radius : 12px 3px;
        -webkit-border-bottom-right-radius : 12px 2px;
        left:-101px;
        top:-9px;
}
</style>
</head>
<body>
<span class="btnForward"></span>
</body>
</html>
*******************************************
Como se puede ver, hay solo una linea:

<span class="btnForward"></span>

Y esto no es una imagen como tal.
Dos imagenes enviadas son dos capturas de la pantalla, que corresponden a visualizacion del este codigo por Chrome para zooms 100% y 110%