Changes in the HTML structure

Media Query is a condition declared for browser to include or exclude a set of CSS rules or a separate stylesheet. Read more about Media Queries. There are two methods for CSS declaration with Media Queries: 1. Declare a single stylesheet and include Media Queries into CSS. Here is an example: /*---rules for mobile devices----*/ @media screen and (max-width: 480px) { #wrapper{ width: 320px; min-width: 320px; }
Usually portable device such us mobile phones and tablets has a small screen, so during navigation mobile browser scales the website and fits it to screen. Viewport is a HTML meta tag created to control layout on mobile browsers. Here is a simple example of viewport meta tag:<meta name="viewport" content="width=device-width, initial-scale=1.0">