CSS Media Queries For All Common Devices

CSS Media queries are an outstanding way to provide distinctive styles to different devices that’s the most excellent experience for every user. A part of the CSS3 specification as the role of the media attribute has been extended by CSS media queries which helps to let you know that how to control the style you applied.

[css]
/* Smartphones (portrait and landscape) ———– */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* STYLES GO HERE */
}

/* Smartphones (landscape) ———– */
@media only screen
and (min-width : 321px) {
/* STYLES GO HERE */
}

/* Smartphones (portrait) ———– */
@media only screen
and (max-width : 320px) {
/* STYLES GO HERE */
}

/* iPads (portrait and landscape) ———– */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* STYLES GO HERE */
}

/* iPads (landscape) ———– */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* STYLES GO HERE */
}

Create Html5 Full Screen Background Video

/* iPads (portrait) ———– */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* STYLES GO HERE */
}

/* Desktops and laptops ———– */
@media only screen
and (min-width : 1224px) {
/* STYLES GO HERE */
}

/* Large screens ———– */
@media only screen
and (min-width : 1824px) {
/* STYLES GO HERE */
}

WordPress Pagination Without A Plugin

/* iPhone 5 (portrait & landscape)———– */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px) {
/* STYLES GO HERE */
}

/* iPhone 5 (landscape)———– */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape) {
/* STYLES GO HERE */
}

/* iPhone 5 (portrait)———– */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : portrait) {
/* STYLES GO HERE */
}
[/css]

How to Show or Hide Widgets on Specific Pages without Plugin

View source →