Eric Meyer’s CSS Sculptor

Eric Meyer’s CSS Sculptor

This is my latest favourite ‘toy’ that I’m playing with just now. Eric Meyer’s CSS Sculptor is a Dreamweaver Extension (for DW8 or DW CS3) from WebAssist developed in collaboration with the CSS guru himself. It’s not cheap, though: normal price is US $149.99, although I got it on special offer via .net magazine for US $104.99.

This extension allows you to quickly create a standards-compliant, CSS-based layout in minutes, rather than hours, in six simple steps:

  1. Choose one of the 30 built-in layouts (e.g. 1 Column, Fixed, Centered; 2 Column Elastic, Left Sidebar; 3 Column Fixed, Header and Footer, etc.)
  2. Customize widths and heights, margins and padding
  3. Set basic typography (text, h-tags and links)
  4. Style each div with background colours and/or images
  5. Define which layout components to show or hide in a print style sheet
  6. Once you’ve decided on a Doctype and whether to include the CSS in a separate file or within the document head click Finish to allow the extension build the code — it will build with or without explanatory comments, which are really useful for understanding what it’s done and why

Output code supports Internet Explorer 5.5 – 7.x, Firefox 2.x, Safari 2, Opera 9; earlier versions of Netscape and Firefox are notably absent from this list but all code that I’ve created with this extension so far have worked fine in Netscape 7.2 and Firefox 1.x.

Obviously, this isn’t a replacement for knowing CSS inside out — everyone does, right? 😉 — but it’s a great tool to add to the arsenal, and a great way to learn CSS, or simply to knock up a CSS-based design very quickly.