Note: This article has been updated for Dreamweaver 8. If you are still using Dreamweaver MX 2004, please read the version of this article series for Dreamweaver MX 2004. The CSS features in Dreamweaver have been vastly improved in Dreamweaver 8. You can learn about those changes in Julie Hallstrom’s article, An Overview of CSS in Dreamweaver 8.

Welcome to the second part of this article series on CSS design concepts. If you missed Part 1, you can get to it below:

Designing with CSS – Part 1: Understanding CSS Design Concepts

This series reviews how you can use Dreamweaver 8 to move towards CSS as a positioning technique when developing web pages. Part 2 builds on what you learned in Part 1. I discuss floating elements and investigate the height property. In addition, I cover inheritance and specificity. In Part 3 you’ll create your first CSS-positioned layout.

You may find it advantageous to read an earlier tutorial I wrote for the Developer Center on relative, absolute, and static positioning, called Introduction to CSS Positioning in Dreamweaver MX 2004. It should give you a decent grounding in what you can achieve with each of the positioning values.

Requirements

To complete this tutorial you will need to install the following software and files:

Dreamweaver 8

Tutorials and sample files:

• css2_samples.zip (ZIP, 2K)

Prerequisite knowledge:

• Lorem Ipsum Generator extension by Captain Cursor Creations (optional)
• Internet Explorer browser
• Firefox browser
• Read Part 1 of this series