Sign In | Subscribe

Enter your Sign on user name and password.

Forgot password?
  • Follow us on:
Start learning today, and be successful in your academic & professional career. Start Today!
Loading video...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of CSS
  • Discussion

  • Download Lecture Slides

  • Table of Contents

  • Related Services

Lecture Comments (8)

1 answer

Last reply by: Professor Strine
Thu Sep 4, 2014 8:11 PM

Post by Kestas Balevicius on July 8, 2014

How to understand float property? What it does?

0 answers

Post by Adil Alkarkhi on March 30, 2013

so I know how to control positions in sides positions, float left and change the width, what about if I want to put a content under them how to control the bottom and top positions?

0 answers

Post by Amit Patel on January 8, 2013

You could also use followings:
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box; /* Firefox, other Gecko */
box-sizing: border-box;
at the top of style sheet to have header, footer, nav, section, and aside to fit to the box so that all elements fit, and doesn't required any adjustment in pixel. \

1 answer

Last reply by: Robert Bartram
Mon Jan 2, 2012 6:58 AM

Post by Robert Bartram on January 1, 2012

Hi, Just a note of interest. I tested code using IE9 and looks like some of the features of HTML5 are not supported. However found the same code works fine for Firefox and Safari. Thanks

1 answer

Last reply by: Brenton Strine
Fri Aug 19, 2011 6:09 PM

Post by JC Vargas on April 19, 2011

Why did we give the section a class name and not and id? what does it make a difference at this point? Video possition 5:20. Thank you


Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.

  • Intro 0:00
  • Layout HTML 0:46
    • Page Layout
    • Avoid Contracting Divitis
    • Header, Nav, Aside, Section, and Footer
  • Example: A Basic Layout 3:55
    • Step 1: Structure Page, Apply Basic Styles, and Position Elements Correctly
    • Step 2: Use Container Elements and Center the Layout
    • Step 3: Add an Aside Column
    • Step 4: Create Two Main Content Columns
    • Final Result and Conclusion