Note: This is the Dreamweaver MX 2004 version of this article. It has been updated for Dreamweaver 8 and you can find the updated version of the article here. 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 sixth part of this article series on CSS design concepts. If you missed the earlier tutorials in this series you can find them below.

Designing with CSS in Dreamweaver MX 2004 – Part 1: Understanding CSS Design Concepts

Designing with CSS in Dreamweaver MX 2004 – Part 2: Defining Style Properties and Working with Floats

Designing with CSS in Dreamweaver MX 2004 – Part 3: Creating Your First Design Without Tables

Designing with CSS in Dreamweaver MX 2004 – Part 4: Creating a Two-Column Layout

Designing with CSS in Dreamweaver MX 2004 – Part 5: Defining Columns and Vertical List Navigation

In this series, I am reviewing how you can use Dreamweaver MX 2004 to move towards using the CSS positioning technique of developing web pages.

In this, the final part in this series, I will review alternative methods to create a two-column layout. So far, I have used the float method (my preferred option), but I could also position the navigation div to achieve the same results. I will review the positioning method in this tutorial, and I’ll explain why I prefer the float method over the positioning method. In this tutorial, you won’t use the CSS and page layout you created in earlier parts of this tutorial series; you will be concentrating solely on the structure of the page. I’m sure you have a good grasp on styling your pages now, as I have covered that topic in depth earlier in the series.

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 positioning value.

Requirements

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

Dreamweaver MX 2004

Sample files:

• css6_samples_mx2004.zip (ZIP, 2K)