0
.body-content {
        padding-right: 1em;
        padding-left: 1em;
        width: 100%;
        height: 100%;
        background: #1b1e24;
}
body {
        padding-top: 3.8em;
        padding-right: 0em;
        padding-left: 0em;
        width: 100%;
        height: 100%;
        background: #1b1e24;
        font-family: 'Trebuchet MS';
        -webkit-font-smoothing: antialiased;
        /*-ms-transform: scale(1);
        transform:scale(1);*/
}

Eso es lo que tengo en el css para el contenido de la pagina, quiero poder hacer zoom en el navegador de una pc de escritorio y que el contenido no se adapte que el zoom sea al contenido como en los celulares.

Así es la esta la pagina con 100% de zoom

Así quiero que haga el Zoom aquí esta al 175% el zoom

Ese zoom quiero que haga

1
  • Relacionado a lo que dicen en la respuesta... estás usando la unidad de medida 'em' ... la cual es equivalente al tamaño de puntos de la tipografía... 1em = 16 puntos o algo asi. Por lo que debes usar otra unidad de medida.
    – Excorpion
    el 1 jun. 2021 a las 16:04

1 respuesta 1

1

Algo que podrías hacer es usar unidades del viewport, estas funcionan relativas a porcentajes del viewport (lo visibile en tu navegador), lo puedes hacer para secciones específicas que requieran esa funcionalidad pero en general no lo recomiendo, el zoom permite que la experiencia de usuario sea buena si el usuario tiene dificultades visuales.

Acá un ejemplo

NOTA: Ten en cuenta que el ejemplo funciona bien, tienes que probarlo en una página aparte ya que si haces zoom dentro de Stackoverflow no funcionará

.body-content {
  padding-right: 1vw;
  padding-left: 1vw;
  width: 100%;
  height: 100%;
  background: #1b1e24;
  
  /* Ejemplo */
  color: white;
  font-size: 3vw;
}

body {
  padding-top: 3vw;
  padding-right: 0;
  padding-left: 0;
  width: 100%;
  height: 100%;
  background: #1b1e24;
  font-family: 'Trebuchet MS';
  -webkit-font-smoothing: antialiased;
}
<div class="body-content">
Este exto no cambiara de tamaño si haces ZOOM
</div>

3
  • Gracias por tu aportación lo hice pero algunas partes se siguen adaptando con el zoom
    – sasuke
    el 1 jun. 2021 a las 18:08
  • ¿Aplicaste la unidad vw al elemento que necesitas? el 1 jun. 2021 a las 18:12
  • No, se lo agrego al padding-left y padding-right nada más?
    – sasuke
    el 1 jun. 2021 a las 18:22

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.