Responsive Web Design: Flexible, grid based layout
A flexible grid based layout means that the layout of the web page should be defined in a relative value. This flexible grid allows the website to respond to different device widths. If you set a web page to be 90% width of the screen size then every device that views that web page would have a good reading experience.
Traditionally ‘non-responsive’ websites have a set width, set in a fixed value. A fixed value of 900px (900 pixels).
This would display fine on a traditional desktop PC – which large screen size can easily accommodate 900 pixels, but a mobile device with a screen width of 320px the same layout would not read well, with the content area not able to display fully on the small screen.
But if we set a relative value as the width then the screen is mostly irrelevant:
This content area would respond to the screen size.