Media Querys css3 tamaños de pantalla

Lo más común es que usemos las Media Queries para detectar las dimensiones de la pantalla, a continuación un ejemplo con los tamaños más comunes usando min-width el cual determina el tamaño mínimo de la pantalla o usando max-width para el tamaño máximo de la pantalla donde se aplicara la regla de estilo.

@media (min-width: 320px) { .rd5_search__form .rd5_search__buttons .rd5_search__advance a { padding: 2.2rem 0; } }

@media (min-width: 480px) { .rd5_search__form .rd5_search__buttons .rd5_search__advance a { padding: 2.5rem 0; } }

@media (min-width: 768px) { .rd5_search__form .rd5_search__buttons .rh_prop_search__advance a { padding: 2.7rem 0; } }

@media (min-width: 1024px) { .rd5_search__form .rd5_search__buttons .rd5_search__advance a { padding: 3.3rem 0; } }

@media (min-width: 1140px) { .rd5_search__form .rd5_search__buttons .rd5_search__advance a { padding: 2.85rem 0; } }

@media (min-width: 1280px) { .rd5_search__form .rd5_search__buttons .rd5_search__advance a { padding: 3.6rem 0; } }

Cuando dierentes Media Queries son válidas para un entorno y surgen conflictos, éstos se resolverían por la norma de la cascada, de tal manera que las últimas reglas de estilo definidas serían las que se tendrían en cuenta.

Scroll al inicio