screen-size

A narrow vertical strip of top level destinations at the side of a screen, used at medium widths where a bottom bar is wasteful and a drawer is too heavy.

A layout that switches between a few discrete arrangements chosen per size class, rather than flowing continuously as the window changes.

A viewport width at which a layout is allowed to change shape, defined once so every screen in a system reflows at the same places.

One of a small set of proven multi pane arrangements a platform recommends, such as list detail, supporting pane and feed, instead of a new layout per screen.

A responsive pattern where full height columns peel off one at a time and stack below as the viewport narrows, keeping source order.

A rule that responds to the size of a component's own container rather than the viewport, so one component adapts anywhere it is placed.

Deciding how blocks of content reorder and regroup as a layout reflows, so hierarchy survives the collapse from several columns into one.

A row of equal cards that wraps to fewer per line as space runs out, with the last line left aligned at its natural size rather than stretched to fill.

A virtual unit of length that stays the same physical size across screen densities, so one number can describe a layout on every device.

The physical fold state of a foldable device, such as flat, book or tabletop, which a layout can respond to alongside plain size.

The camera housing that intrudes into the screen rectangle, which a layout has to route content around rather than under.

Drawing an app behind the system bars so content reaches the physical screen edges, with insets applied only to what must stay tappable.

A grid whose columns and gutters are expressed as proportions rather than fixed pixels, so the whole composition stretches and shrinks with its container.

A mail layout that reflows with no media query at all: percentage widths held in by max-width, with fixed-width ghost tables that only Outlook can see.

A spacing ramp whose every step interpolates between a minimum and a maximum viewport, so gaps grow smoothly with the screen instead of jumping at breakpoints.

Building layouts from what the content needs, using grid, flexbox and intrinsic sizing together, instead of imposing a fixed column skeleton.

A responsive pattern where the arrangement genuinely differs per breakpoint rather than reflowing, so each size gets its own composition.

A browsable list paired with a pane showing the selected item in full, collapsing to one screen at a time when the window is narrow.

Designing and writing the narrow layout first and adding rules as space is gained, so the small screen is the default rather than the fallback.

A responsive pattern where a multi column grid stretches with the viewport up to a maximum width, then centres, stacking only on the smallest screens.

Keeping secondary regions parked outside the viewport and sliding them in on demand, instead of stacking them below the main content.

The inset a television layout keeps clear of the screen edge, about five percent, because sets crop the outer frame and anything near it disappears.

How many physical pixels a display packs into an inch, and the reason a CSS pixel is a unit of measure rather than a dot on the screen.

A grid that decides its own column count from a minimum item width, so the same one line rule works at every screen size without a single breakpoint.

Designing what a layout does with the space it gains on very wide screens, rather than only what it drops as screens narrow.

One layout that adapts to any screen through fluid grids, flexible images and media queries, rather than a separate site built for each class of device.

The part of the screen guaranteed clear of notches, system bars and rounded corners, where interactive content can safely sit.

How an app arranges itself when one window is stretched across two displays, either keeping content clear of the seam or splitting the layout exactly at it.

A layout of two or more side by side panes where a choice in the leading pane decides what the trailing pane shows.

A secondary pane holding content that only makes sense next to the main pane, placed beside it on wide windows and below it or behind a control on narrow ones.

A layout primitive that flips between a row and a column at a threshold it works out from its own width, with no media query involved.

The lightest responsive pattern: a single column design that only adjusts type size, image size and margins as the screen changes.

The visible rectangle of a page inside the browser window, excluding the browser's own bars, and the unit basis for vh and vw.

A named bucket for how much width an app window has, such as compact, medium and expanded, used in place of raw device categories.

The register for screens read from a couch: focus-driven navigation with a remote, oversized type and cards, horizontal rails, and safe margins for TV overscan.

A horizontal menu that keeps as many items visible as fit and moves the rest into a More control, recalculating whenever the available width changes.

Type sizes that scale continuously with the viewport between a minimum and a maximum, rather than jumping at breakpoints.

Restricting a screen to portrait or landscape, which strands anyone whose device is fixed in a mount or a wheelchair arm in the orientation the design refused.

The requirement that content works in one column at 320 CSS pixels wide without two dimensional scrolling, which is 400 percent zoom on a desktop.