Lesson 12

Creating Layouts Using Modern CSS Techniques

What You’ll Learn in This Lesson:

  1. How fixed layouts work

  2. How liquid layouts work

  3. How to create a fixed/liquid hybrid layout

  4. How to create CSS flexible box layouts

  5. How to use CSS grid layouts

So far, you’ve learned a lot about styling web content, from font sizes and colors to images, block elements, lists, and more. But what we haven’t yet discussed is a high-level overview of page layout. Page layout is how a whole web page looks to the viewer. Most beginning web designers think of this as a static feature and have a goal of creating web pages that look identical in every web browser and device that views it. But that’s only one way to design web pages, and it’s not a very good way. ...

Get Sams Teach Yourself HTML, CSS, and JavaScript All in One, Third Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial