Summary

In this chapter, we not only made some significant changes to our media queries and to the layout of the Carborelli's site, but we also learned about some concepts such as pseudo-classes and fat footers, and how to make them adapt to different screen widths. In particular, we added CSS to each of our media queries. We changed the layout of the header for all screen widths to make best use of the screen space and improve the user experience. We changed the layout of the content and sidebar, bringing the sidebar below the content for tablets in portrait mode and screen widths below that. We examined different approaches to the layout of widget areas within a sidebar or a footer, including identifying how many widgets to place side by side and what code to write to achieve that layout. We also learned a few methods to get the edges of the left-hand and right-hand side widgets aligned with the rest of the content. We also altered the layout of the Carborelli's footer on mobiles so that...