Sign In | Subscribe
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 Adobe Dreamweaver CC
  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Related Books

Bookmark and Share

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
Get immediate access to our entire library.

Sign up for Educator.com

Membership Overview

  • Unlimited access to our entire library of courses.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lesson files for programming and software training practice.
  • Track your course viewing progress.
  • Download lecture slides for taking notes.
  • Learn at your own pace... anytime, anywhere!

How to Use CSS for Page Layout

  • The file used for this lesson is located in the extras folder within the course files and is called html-css-layout-cc.jpg
  • HTML and CSS work together in the browser to create page layouts
  • This file explains how HTML and CSS work together to create these layouts
  • In order to work with page layouts using CSS, we use a combination of html div tags, a tag that represents a division of content, or other HTML tags that are now available in HTML5
  • Styles get assigned to those divs or tags by assign a name using an id to that content area or div
  • Once we have named an area of the page using an ID, we can then tell the browser where and how to display that content on the page
  • This takes 2 steps
    • HTML portion-Create the html tags and place content inside those tags
    • CSS portion-Give each tag  on the page a unique name and create styles that tell the browser how to display each tag

How to Use CSS for Page Layout

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
  • HTML Functions 1:02
    • Assigning Names
  • CSS 2:44
    • Formatting and Positioning
  • Content Area 3:59
    • Adding ID
    • Selectors
    • Properties and Values
  • Coding 6:12
    • Div id= content
    • Wrapper
  • CSS Code Styles 8:46