Suggest an editImprove this articleRefine the answer for “What is "fluid design"?”. Your changes go to moderation before they’re published.Approval requiredContentWhat you’re changing🇺🇸EN🇺🇦UAPreviewTitle (EN)Short answer (EN)**Fluid design (liquid layout)** is an approach in which element widths are set in relative units, most often `%`, so the layout stretches together with the browser window without rigid "steps". **Key point:** fluid design is an "elastic" layout in which elements change width smoothly and proportionally to the screen width.Shown above the full answer for quick recall.Answer (EN)ImageFluid design (or liquid layout) is an approach in which **element widths are set in relative units, most often** `%`, thanks to which the layout **stretches together with the browser window**, smoothly changing sizes without rigid "steps". ## Main idea Blocks adjust to the width of the viewport, taking up a proportional part of the available space. ## Characteristic features - width is set in percentages: `width: 50%`, `70%`, `100%` - elements stretch or shrink when the screen width changes - fonts and spacing can also be relative (for example, `vw`, `%`, `em`) - the site looks "elastic" without fixed boundaries ## Comparison with other approaches | Approach | What scales | |---|---| | **Fixed** | nothing, rigid `px` | | **Fluid / Liquid** | blocks by width (via `%`, `vw`) | | **Elastic** | scale based on font size (`em`, `rem`) | | **Responsive** | rearrangements via media queries | ## Summary Fluid design is an "elastic" layout in which elements change width smoothly and proportionally to the screen width, creating a flexible, stretchable grid.For the reviewerNote to the moderator (optional)Visible only to the moderator. Helps review go faster.