RWD is a truly modern design principle. As defined by Wikipedia, Responsive web design is an approach to web design which makes web pages render well on a variety of devices and window or screen sizes. So essentially it allows websites to scale and adjust as the browser size increases.
One easy way to create a responsive website. Flex boxes are containers, whether shown as actual boxes are not, that contain the websites content and break it up into chunks. As the browser size goes up and down the boxes are rearanged to fit on the page. By default it will try to fit them all across horizontally, but you can specify the size, order and layout of the boxes to acheive a desired effect.
By setting your boxes up in a container with flex wrap set up in your css the browser will do most of the work for you. From there you just have to set pixel widths or percentages so the browser knows how wide each box should be. For example the middle three boxes will all fit into one column by setting the width percentages up so they add to 100%. By setting the other two to 100% I can ensure that they are allocated an entire row. But this layout isn't fully realized unless you have a large enough browser window. As the window gets narrower the boxes will shift down to the next row to ensure that everything fits well on smaller screens or browsers.
"Designing a responsive webpage can be tedious, but the end result will ensure that your webpage looks good no matter what platform it's viewed on."
This website provides a simple example of RWD, it utilizes a style known as column drop. In this style of RWD the flex boxes will rearange as the browser gets wider. At its most narrow point the boxes will all sit on top of eachother and go down vertically. As the browser gets wider the boxes will begin to form rows. You can also assign widths to the boxes to achieve a desired layout.