
www.webade.co.uk
www.communitymx.com
www.ukcsstraining.co.uk
Note: This article has been updated for Dreamweaver 8. 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 third part of this article series on CSS design concepts. If you missed Parts 1 or 2, you can get to them below:
Designing with CSS – Part 1: Understanding CSS Design Concepts
Designing with CSS – Part 2: Defining Style Properties and Working with Floats
In this series, we review how you can use Dreamweaver 8 to move towards using CSS as a positioning technique when developing web pages. Now that you have completed Parts 1 and 2, you are ready to move on and create your first CSS-positioned layout. You will design a fixed-width page that allows the contents to flow. You will use an unordered list to create a horizontal navigation system. You will also design a banner image in Fireworks and use it on the page.
After you complete Part 3 you will have created your first CSS layout. Its structure resembles Figure 1.
Figure 1. The completed structure
To complete this tutorial you will need to install the following software and files:
Adrian Senior owns the UK-based web design agency Webade, which has been in business since 1998. He is also a member of Team Macromedia and a partner at Community MX. The year 2004 saw Adrian's first trip to America, where he visited Orlando and delivered two sessions at the TODCon conference.
Adrian also provides training courses for companies who need to train their designers how to build compliant, accessible web sites using CSS and xhtml.
He's been married to his wife, Janette, for 24 years and has two children, Antony and Eleanor.