New CSS Features in Dreamweaver CS5

Dreamweaver CS5 advances the process of building CSS-based, standards-compliant sites with three new key features: CSS starter layouts, CSS inspection, and CSS enable/disable.

CSS Starter Layouts

To create a new document using a CSS-based layout:

  1. Go to the File menu.
  2. Select New.

The New Document menu will then open, allowing you to create pages with fixed or liquid CSS-based selections. Layout CSS can be toggled to be created in a new file, added to head or linked to an existing file.

CSS Inspection

Inspect Mode is a CS5 feature that allows users to inspect CSS-based elements and obtain visual feedback by highlighting CSS-based elements. As the user hovers the mouse over the document, CS5 displays corresponding live code and live view for the selected item.

CSS Inspect Mode and Workspace

The CSS inspection tool tends to work better with some workspaces than others, so Dreamweaver may prompt you to adjust your workspace so that CSS Inspect can be used to its full capacity with a click of the Switch button.

If you are hesitant to change your workspace, click the More Info button to preview the changes Dreamweaver suggests for your workstation.

CSS Enable/Disable

As an update to the CSS Styles panel, users can enable and disable CSS-based elements, either individually or by class. Elements can also be edited and deleted individually or by class with the click of a button.


Dreamweaver is a popular Adobe program for creating websites and applications.  It supports HTML5, CSS3, PHP, FTP, jQuery and more; and it works with HostGator web hosting.

You can learn more about Dreamweaver by visiting Adobe's website or the video learning portal, Adobe TV.  The video in this article is courtesy of Adobe TV.