We're close to finishing a complete site based on the two-column, fixed-width, left sidebar, header and footer Dreamweaver CS5 CSS Starter Page. All we have left is to add some content to the pages other than the home page. In this installment we're going to add a data table to the accommodations page of the Safari site. (Or, you can adapt the techniques to your own site.)

We're going to perform a fancy little trick with this table. We're going to use the :nth-child pseudo class to create alternating colors on the table rows while keeping our markup nice and clean. Then we're going to use a script to make Internet Explorer support the pseudo class, though natively it really would prefer not to.

This tutorial includes starter and completed files.

The CS5 CSS Starter Page Series:
The CS5 CSS Starter Page Series - Part 1: The Yukon
The CS5 CSS Starter Page Series - Part 2: Marking up the Page
The CS5 CSS Starter Page Series - Part 3: Structuring with CSS
The CS5 CSS Starter Page Series - Part 4: Refining Details with CSS
The CS5 CSS Starter Page Series - Part 5: Adding Navigation Systems
The CS5 CSS Starter Page Series - Part 6: Converting to Horizontal Navigation
The CS5 CSS Starter Page Series - Part 7: Adding CSS3 Pods
The CS5 CSS Starter Page Series - Part 8: Adding a Custom Font
The CS5 CSS Starter Page Series - Part 9: Quality Assurance
The CS5 CSS Starter Page Series - Part 10: Making it Your Own
The CS5 CSS Starter Page Series - Part 11: Creating the Template
The CS5 CSS Starter Page Series - Part 12: Adding a Data Table...

Related Articles

• What's New in the Adobe BrowserLab CS Live Service
• Color Picker Extension
• Introducing CMX JumpStart Merry Christmas
• CMX JumpStart: Merry Christmas
• Diff (file differences) and Dreamweaver
• The CS5 CSS Starter Page Series Part 15: Lesson Plan for Teachers
• New Dreamweaver Template Tutorials
• Introducing CMX JumpStart Lucknow
• CMX Jumpstart: Lucknow
• The CS5 CSS Starter Page Series Part 13: Adding a Gallery

• Homework and Exams: A Dreamweaver/Fireworks Midterm
• The CS5 CSS Starter Page Series - Part 11: Creating the Template
• The CS5 CSS Starter Page Series - Part 10: Making it Your Own
• The CS5 CSS Starter Page Series - Part 9: Quality Assurance
• The CS5 CSS Starter Page Series - Part 8: Adding a Custom Font
• From CPanel to Dreamweaver - Getting Your MySQL On!
• Quick Shot - Check for Existing User Names On a Sign Up Form
• The CS5 CSS Starter Page Series - Part 7: Adding CSS3 Pods
• The CS5 CSS Starter Page Series - Part 6: Converting to Horizontal Navigation
• The CS5 CSS Starter Page Series Part 5: Adding Navigation Systems