0

Tengo un formulario de un tamaño especifico, pero quiero que si la pantalla tiene una resolución de menos 1024px, el tamaño del formulario se reduzca( que sea responsivo vaya). Este es el html:

<mat-form-field appearance="outline" class="user">
   <mat-label style="font-family: Roboto;"><b>User</b></mat-label>
       <input style="font-family: Roboto; font-size: 20px;" matInput [(ngModel)]="user">
       <mat-icon class="icon2" matSuffix>account_box</mat-icon>
</mat-form-field>

esta es la "validacion":

<script>
 if (screen.width < 1024) {
   document.write("Pequeña")
 } else { }
</script> 
3
  • Deberías hacerlo en CSS. Es cómo esta pensado para solucionar este tipo de cosas. Tiene las funciones por reglas de dispositivos, @media
    – VRoxa
    Commented el 13 may. 2020 a las 7:32
  • Podrías decirme como? aplicado a este ejemplo
    – Arb
    Commented el 13 may. 2020 a las 7:40
  • Olvidalo, ya lo hice y funciono :DD muchas gracias
    – Arb
    Commented el 13 may. 2020 a las 8:06

1 respuesta 1

0

Ya lo consegui, use las reglas de dispositivos de CSS @media, lo hice de la siguiente forma:

 @media screen and (max-width: 2000px) {
    .mat-form-field {
      width: 100px;
    }
  }

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.