Responsive web design (often abbreviated to RWD) is an approach to web design in which a site is crafted to provide an optimal viewing experience across a wide range of devices (from desktop computer monitors to mobile phones).
The technique achieves optimal viewing experience by
- Media queries, allowing the page to use different CSS style rules based on characteristics of the device the site is being displayed on, most commonly the width of the browser.
- Fluid grid concept, calling for page element sizing to be in relative units like percentages or EMs, rather than absolute units like pixels or points.
- Flexible images are also sized in relative units (up to 100%), so as to prevent them from displaying outside their containing element.