elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Como proteger una cartera - billetera de Bitcoin


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  ¿Cómo puedo ajustar las resoluciones?
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: ¿Cómo puedo ajustar las resoluciones?  (Leído 2,486 veces)
andrecid

Desconectado Desconectado

Mensajes: 126


Haz lo que quieras, por que nadie te puede obligar


Ver Perfil
¿Cómo puedo ajustar las resoluciones?
« en: 28 Junio 2016, 11:26 am »

Hola , estoy trabajando en un proyecto pero tengo un problema que no me gusta nada...

La cosa es que en mi web cuando está la ventana del navegador al máximo se ve perfectamente pero cuando lo voy minimizando algunos divs se van mezclando con otros etc..

¿Alguien me ayuda?


En línea

eLank0
eLhAcKeR r00Lz


Desconectado Desconectado

Mensajes: 1.062



Ver Perfil WWW
Re: ¿Cómo puedo ajustar las resoluciones?
« Respuesta #1 en: 28 Junio 2016, 14:39 pm »

https://developer.mozilla.org/es/docs/CSS/Media_queries

Con los media queries puedes aplicar distintos CSS según algunos parámetros.

Salu2


En línea

gAb1


Desconectado Desconectado

Mensajes: 731


Ver Perfil
Re: ¿Cómo puedo ajustar las resoluciones?
« Respuesta #2 en: 29 Junio 2016, 02:12 am »

A parte de los medias queries tambien es importante trabajar con unidades dinámicas, como el % y vh/vw (virtual height y width que basicamente es el alto y ancho de la pantalla, no del elemento).

Para poder trabajar con vh y vw hay que configurar el viewport en el html:

Código
  1. <meta name="viewport" content="width=device-width, initial-scale=1.0" />

Tambien puedes usar calc() para todavía conseguir un nivel más dinámico, por ejemplo: quieres que un div tenga el 100% del padre pero este tiene 10px de padding:

Código
  1. div.child { width: calc(100% - 20px) }

Te dejo un ejemplo de como usar % y calc(): https://jsfiddle.net/y5x3jyc9/

Edito: Te dejo también el ejemplo que acaba de crear para la otra pregunta: https://jsfiddle.net/y5x3jyc9/2/
« Última modificación: 29 Junio 2016, 03:10 am por gAb1 » En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines