# Responsive design

One page that adapts its layout to any screen size.

## What is **responsive design**?

**Responsive design** means one page that adapts its layout to any screen size, from phone to wide monitor.

```css
img { max-width: 100%; height: auto; }
@media (min-width: 900px) { .page { display: grid; grid-template-columns: 1fr 3fr; } }
```

Level: Journeyman · [More CSS terms at this level](https://www.ask-codey.com/glossary/subjects/css/journeyman)

Updated: September 27, 2026

Source: https://www.ask-codey.com/glossary/responsive-design