Something Like that:
@media
In the CSS you can write many more media screen
Media for Tablet Portrait view
CSS
@media (min-width:768px){ /*Your CSS code*/ }
Media for Tablet Landscape view
CSS
@media (min-width:992px){ /*Your CSS code*/ }
Media for Desktop
CSS
@media (min-width:1200px){ /*Your CSS code*/ }
Media for Mobile Landscape view
CSS
@media (max-width:767px){ /*Your CSS code*/ }
Media for Mobile Portrait view
CSS
@media (max-width:479px){ /*Your CSS code*/ }
There is also CSS for Portrait and Landscape view
orientation : portrait
orientation : landscape
CSS
@media (max-width:767px) and (orientation : portrait){ /*Your CSS code*/ } @media (max-width:767px) and (orientation : landscape){ /*Your CSS code*/ }
Is any one know How CSS read in browers?
Bottom to Top
Yes That’s why always write your css code like this.
CSS
@media (min-width:768px){ /*Your CSS code*/ } @media (min-width:992px){ /*Your CSS code*/ } @media (min-width:1200px){ /*Your CSS code*/ } @media (max-width:767px){ /*Your CSS code*/ } @media (max-width:479px){ /*Your CSS code*/ }