В чём разница между fixed, fluid и responsive layout?

Question

Accepted Answer

## Определения
- **Fixed** — ширины в px; на узком экране появляется горизонтальный скролл.
- **Fluid** — проценты/`fr`/flex: тянется с viewport, но без осознанных переломов структуры.
- **Responsive** — fluid + **breakpoints**/container queries: меняется раскладка (колонки → стек).

```css
.fixed { width: 960px; }
.fluid { width: 80%; }
.responsive { width: min(100% - 2rem, 72rem); }
@media (max-width: 600px) { .cols { flex-direction: column; } }
```

Adaptive иногда путают с отдельными шаблонами под устройства; responsive обычно один код.

## Итог
Fixed — жёстко; fluid — резиново; responsive — резиново *и* перестраивается.