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!

Fixed Positioning

  • We will look at a CSS positioning property called fixed positioning
  • Fixed position elements do not scroll with the page, they remain fixed in place even if the page is scrolled
  • You can create some interesting pages using this property
  • Let's look at how to use the fixed property on a page
  • Open fixed.html which is our example page
  • Insert the vegas-panorama.jpg image below all the content on the page where it says fixed image goes here
  • We will position this image using fixed positioning
  • Open the fixed.txt file in the text folder and add it to the CSS rules on the fixed.html page
  • View the page in the browser and scroll the page to see how it displays
  • See how that image does not move in the browser

Fixed Positioning

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
  • Add Image 1:05
    • Matching to Wrapper
  • Set Fixed Positioning on Div 2:03
    • Copy/Paste ID Rule
    • Preview
    • Design View
    • CSS Designer
    • Show Set
  • Deleting Fixed Image 5:08
    • Assigning Background Image
    • Preview