Summary

In this chapter, we've learned how to change a rigid pixel-based structure to a flexible percentage-based one. We've also learned how to use ems, rather than pixels for more flexible typesetting. We now also understand how we can make images respond and resize fluidly as well as implementing a server-based solution for serving entirely different images based upon device screen size. Finally, we've experimented with a responsive CSS Grid system that allows us to rapidly prototype responsive structures with very minimal effort.

However, until this point we've been pursuing our responsive quest using HTML 4.01 for our markup. In Chapter 1, Getting Started with HTML5, CSS3, and Responsive Web Design, we touched upon some of the economies that HTML5 offers us. These economies are particularly important and relevant for responsive designs where a "mobile first" mindset lends itself to the leanest, fastest, and most semantic code possible. In the next chapter, we're going to get to grips...