After all the hard work of learning how the new Dreamweaver CS5 CSS Starter Pages work, it's time to have some fun with them. The "next big thing" on the web is CSS3 properties that let you create all kinds of visual effects without using images. In this installment of the series, we're going to create three pods in the sidebar, each of which will contain a heading and paragraph with a link to a page with more information about its topic. The pods will have rounded corners, box shadows, and a gradient background. In the old days this would have required multiple DIVs and images. CSS3 offers the promise of freedom from all of that. Web standards compliant browsers offer good, though differing, support for CSS3. While these properties do not work in Internet Explorer 6, 7, and 8 (Internet Explorer 9 is about to arrive and will support many CSS3 properties), you have some choices in handling the web's problem child browser. We'll get to that towards the end of the tutorial.

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

Related Articles

• CMX Jumpstart: Lucknow
• The CS5 CSS Starter Page Series Part 13: Adding a Gallery
• The CS5 CSS Starter Page Series Part 12: Adding a Data Table
• 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 6: Converting to Horizontal Navigation
• The CS5 CSS Starter Page Series Part 5: Adding Navigation Systems
• The CS5 CSS Starter Page Series Part 4: Refining Details with CSS
• Creating a Site in Dreamweaver CS5
• The CS5 CSS Starter Page Series Part 3: Structuring with CSS
• Introducing CMX JumpStart Brasilia
• CMX JumpStart: Brasilia
• The CS5 CSS Starter Page Series - Part 2: Marking up the Page
• The CS5 CSS Starter Page Series Part 1: The Yukon
• Dreamweaver CS5 Features Part 1: The All New CSS Starter Pages