Responsive web design ensures your site looks and works well on any device — from phones to ultrawide monitors. The three pillars are: fluid grids (use percentages or fr units instead of fixed pixels), flexible images (max-width: 100% so images never overflow), and media queries (@media rules that apply different styles at different viewport widths). Modern CSS tools like flexbox, grid, and container queries have made responsive design significantly easier than the float-based layouts of the past.
glossary2 min read
Responsive Design Explained
Responsive design makes websites work on any screen size. Learn the principles and techniques.
Try these tools
More glossary articles
What is WebP?
WebP is a modern image format by Google offering superior compression. Learn when and how to use WebP images.
What is HEIC?
HEIC is the default photo format on iPhones. Learn what it is, why Apple uses it, and how to convert it.
What is JSON?
JSON (JavaScript Object Notation) is the standard data format for web APIs. Learn the syntax and common uses.
What is Regex?
Regular expressions (regex) are patterns for matching text. Learn the basics and common use cases.