Ver Mensaje Individual
  #2 (permalink)  
Antiguo 17/11/2014, 08:36
Avatar de Ito79
Ito79
 
Fecha de Ingreso: diciembre-2013
Mensajes: 71
Antigüedad: 10 años, 4 meses
Puntos: 18
Respuesta: Margenes distintos en Bootstrap 3

Cita:
Iniciado por manuelromeroly Ver Mensaje
Estimados, desde ya quisiera agradecer por este magnífico espacio para resolver dudas y compartir información. Soy nuevo en esto y este es mi primer tema.

Mi consulta pasa por lo siguiente:

Tengo margin:0 0 30px 0; en algún div (en Bootstrap) por ejemplo para separlo de un bloque que está inmediatamente abajo.

El problema es que dicho div al visualizarlo en smartphones esos 30px puede ser mucho para un formato tan pequeño y me gustaría que en ese caso el div de arriba tuviera sólo 15px de margin bottom por ejemplo.

¿Tiene alguna idea de como manejar propiedades como márgenes distintos por ejemplo, según la resolución que usemos (xs / sm / md / lg) ?

Muchas gracias !!
Hola,
Para trabajar diferentes estilos para diferentes resoluciones, lo mejor es utlizar las media queries. Básicamente, defines los "cortes o saltos" que quieras en tu web: menor de 700px de ancho, entre 701px y 1200px y más de 1200px por ejemplo. Y para cada salto puedes definir diferentes estilos, en unos pondrás unos márgenes y en otros lo reducirás o ampliarás.

Más información aquí: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

También puedes trabajar con porcentajes y no con píxeles, de forma que quizás se ajuste mejor a lo que buscas, en este caso no usarías Media Queries.

Un saludo