Learn Three-Column Floated Layouts in CSS


show more Three-column floated layouts provides you with in-depth training on Web. Taught by James Williamson as part of the CSS: Page Layouts show less
please wait ...

Three-column floated layouts

Let's take the techniques that we used in our last movie a little bit further by creating three-column layouts. Now, although the source order doesn't matter that much when creating two-column layouts, it does come into play a little bit when considering different techniques when building three-column layouts. So as with our two-column layouts, we're going to take a look at three different ways to create roughly the same layout. So I have three files open here, the 3col_v1.htm, 3col_v2.htm, and 3col_v3.htm, and you can find those in the 03_07 directory.

Now, we're going to start with our version one first. Now, I just want to go down and show you the page structure really quickly here. So we have a header, just like we did last time, and then we have three sections. Notice that one just follows the other one, column1, column2, and column3, and then we have our footer where our copyright stuff goes. So just to show you what that looks like in normal document flow, we just ha...

Three-column floated layouts
Video duration: 11m 30s 8h 57m Beginner

Viewers:

Three-column floated layouts provides you with in-depth training on Web. Taught by James Williamson as part of the CSS: Page Layouts

Subject:
Web
Software:
CSS
Author:
please wait ...