# Breakpoint

A screen width where the layout changes.

## What is a **breakpoint**?

A **breakpoint** is a screen width where the layout changes, for example from one column on phones to three on laptops.

```css
@media (min-width: 1024px) {   /* the "desktop" breakpoint */
  .sidebar { display: block; }
}
```

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/breakpoint