Himas Rafeek
Posted on: 2 years ago
CSS

Media Queries (for Responsive Web Design)

A couple of useful media queries…


                                          /* iPad portrait */@media only screen and (min-device-width:  768px) and (max-device-width: 1024px) and (orientation: portrait) /* iPad landscape */@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) /* iPhone portrait */@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: portrait) /* iPhone landscape */@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: landscape) /**  * other example  */ /* Mobile only */@media screen and (max-width: 623px) /* For Tablet and Desktop */@media screen and (min-width: 624px) /* Desktop */@media screen and (min-width: 948px);