From the course: CSS: Float-Based Page Layouts (2012)

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Fixed, fluid, and responsive layouts

Fixed, fluid, and responsive layouts - CSS Tutorial

From the course: CSS: Float-Based Page Layouts (2012)

Start my 1-month free trial

Fixed, fluid, and responsive layouts

In this course, we are going to focus on building three main types of layouts: fixed, fluid, and responsive. Now I have got examples of all three of those layout types open here, and I want to go over the basics of each of them, as a way of introducing these layout types. So we have got fixed.htm, fluid.htm, and responsive.htm, those three files, open. I have opened them from the 01_09 directory. Now before we preview these in the browser, before we go into the CSS and take a look at the actual concepts that's driving the different types of layouts, I want to go over the structure of the actual HTML. So I am in fixed.htm and if I scroll down into the body of this document, I can see that the page starts with a header that has the headline Alice in Wonderland, and that's followed by an article which contains some of the opening part of the Alice in Wonderland novel. And then if I go down a little bit further, I can see that I have it an aside pass the article, and this aside has a…

Contents