Ethan Marcotte created RWD when web technologies were much less mature than they are today. After years of stuffing all the content into table cells, web developers began to understand how to use floats. There were only a few ways to create a responsive website. There were only two: fluid grids based on percentages and media queries.
It was a real page layout system that allowed us to arrange things on a webpage instead of improvising floating content. Flexbox was not available for several years. CSS Grid was next.
Ten years ago, the new layout systems native to browsers were revolutionary. They were so revolutionary that they ushered in a whole new era. Jen Simmons, in her talk “Everything you know about web design just changed” at the An Event Apart 2019 conference, proposed a new name for it: intrinsic web design (IWD). Let’s first disarm this fancy word. According to Merriam-Webster, intrinsic means, “belonging or constituting the essential nature of a thing.” IWD, then, is a natural approach to web design. It all comes down to using CSS for… laying things out. That’s it.
It doesn’t sound like a revolutionary idea on its own. It opens up a lot of new possibilities that were not available before with table-based or float-based layouts. We got the best of both worlds – two-dimensional layouts, like tables with their rows & columns, with wrapping capabilities (like floating content if there isn’t enough space). There are also more goodies like mixing fluid-sized and fixed-sized elements or intentionally overlapping them.

Use native layout systems to make your browser work for you.
Semantic HTML: Get Started
HTML is the foundation of the internet. It’s a language that formats and structures content for users. It also comes with an added bonus: it will display to the user even if CSS or JavsScript fails to load. The website should still be able to make sense for the user, even if CSS and JavsScript are not available. A website is just a text document that you can create with a text editor like Word or LibreWriter.
Semantic HTML provides accessibility features like headings, which are used by screen reader users to navigate pages. It is important to start with semantic markup, not just any markup.
Use Fluid Type with Fluid Space
When the screen size changes, we often have to adjust the font sizes of our content. The smaller the screen, the less content you can display. Larger screens allow for more content. We should make the content as fluid as we can, which means that it should automatically adjust to the screen size. A fluid typographic system improves the legibility of content when it is viewed in various contexts.
With the clamp() function, we can now achieve fluid type with just one line of CSS.
font-size: clamp(1rem, calc(1rem + 2.5vw), 6rem);

The maths involved is way beyond my comprehension. There is a great article by Adrian Bece on fluid type here in Smashing Magazine, and Utopia can do the maths for you. Beware — there are dragons! Or at least accessibility issues. By limiting font size, we may break the ability to zoom in on the text content. This would violate one of WCAG’s requirements.
Fortunately, fluid spaces are much easier to understand: If gaps (margins between elements) are defined in font dependent units (like rem and em), then they will scale along with the font size. There are some caveats, however.
Always Bet On Progressive Enhancement
Yes, it’s the same technique that has been used for over 20 years to create web pages. It’s still relevant in 2025. Many interesting features are only available in limited quantities — such as cross-page view transformations. It won’t work with every user, but adding one line of CSS will enable them:
@view-transition navigation: auto;

It will not work in all browsers but it won’t break any code. If a browser catches on to the standard, then the code will be there and view transitions will start working in that browser. It’s like opting in to the feature when it is ready.
This is progressive enhancement at its finest: you can turn your stairs into escalators whenever possible.
This is true for many other things in CSS and other web technologies (an unsupported grid is a flow, an unsupported masonry is a grid and so on).
Trust the Browser
It knows a lot more about the safety of users surfing the web. It’s a computer programme, and computers are very good at calculating. Instead of doing it yourself, let them do it. Give them some constraints. You can make the element no more than 60 characters wide and no less than 20 characters narrow. Then relax and watch as your browser makes it 37 characters wide on some rare viewport that you’ve never seen before. It Just Works ™.
But trusting a browser also means that you trust the open web. These algorithms are responsible for the layout of things.
Get rid of the “physical” CSS
I’m giving you a bonus. Layout systems introduced logical CSS. Flexbox has no notion of left or right — it only has a beginning and an ending. This way of thinking was carried over into other areas of CSS and led to the creation of the CSS Logical Values and Properties module. After working with layout systems more, logical CSS is much more intuitive than “physical” CSS. It has one major advantage over the old method: it works better with internationalized content.

It’s a new way of thinking about websites. You can’t apply any numbers to your layout if you don’t have the most basic information (the font size) about your content. You can only think about ratios. If your font size is equal to 2, then your heading could be equal to 2, the main column equal 60, and some text input equal 10, etc. This way, you can scale up any font size.
We’ve done that with layout systems. We let them work on ratios to determine the size of each part of the design. We’ve done the same thing with rems and ems to scale things up based on font size. It’s time to forget the old “1rem=16px” formula and embrace the unknown dimensions.
But that sort of mental shift comes with one not-so-straightforward consequence. By letting the user set the font size, the web developer is able to transfer control from the browser to the user. The browser can also provide us with a lot more information about the user’s preferences.
We can respond to all of these things thanks to CSS. We can, for example, switch to dark mode when the user requests one, limit motion if they request it, or make clickable areas larger if their device has a touchscreen. By having a dialogue with the browser and exchanging information, we empower the end user. The content will be displayed the way that they desire. This makes our website more inclusive and accessible.
The users are the ones who know best what they want. They would appreciate it if we respected their choice. We don’t really know why they did this (maybe they had a vision impairment or a screen that was too far away). We only know that they did.
That’s responsive design to me.