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.
Building flexible layouts: Lab - CSS Tutorial
From the course: CSS: Float-Based Page Layouts (2012)
Building flexible layouts: Lab
Okay, it is lab time. Now, for the flexible layouts lab, I'm not going to make you go through the whole planning process for the desolve.org site. That would be just cruel. Rather, I am going to give you the appropriate values for the main sections, and then let you go through the layout to determine which elements to style, to achieve the desired width and spacing. You might think I am being nice to you there, but probably not. Now you'll also be determining an appropriate overall size range for the layout. You are going to be styling some interior elements and you are going to be on your own there. And then you are going to be fixing an issue with some of the images on the homepage as well. So to starting working on a lab, go into the 06_06 directory, and open up index.htm and the main.css file, which is found in the _css folder of the 06_06. Okay. Now, I just want to go into the browser really quickly. I am going to preview where you are going to start versus where you are going to…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
-
(Locked)
Designing for flexible layouts2m 30s
-
(Locked)
Calculating percentage values8m 45s
-
(Locked)
Setting flexible width values6m 6s
-
(Locked)
Making images flexible8m 10s
-
(Locked)
Setting minimum and maximum widths7m 24s
-
(Locked)
Building flexible layouts: Lab4m 53s
-
(Locked)
Building flexible layouts: Solution6m 47s
-
(Locked)
-
-
-