Skip to content Skip to navigation

Media Queries Code

If you want to override any of the Open Framework breakpoint styles, here are the media queries you should use:

/* Wider than desktop */
@media (min-width: 1200px) { ... }

/* Landscape phone to desktop */
@media (max-width: 1199px) { ... }

/* Landscape phone to landscape tablet */
@media (max-width: 979px) { ... }

/* Small desktop */
@media (min-width: 980px) and (max-width: 1199px) { ... }

/* Portrait tablet to landscape tablet */
@media (min-width: 768px) and (max-width: 979px) { ... }

/* Landscape phone to portrait tablet */
@media (max-width: 767px) { ... }

/* Landscape phones and smaller */
@media (max-width: 480px) { ... }