I'm not exactly sure of how to phrase this question.

I am wondering if there are utilities to work with CSS that people use in addition to say Dreamweave/ExpressionWeb, Firefox/Firebug. Are there cool little CSS utilities that professional web designers use that I may not have heard of?

5 answers

Andy Ford 533

I do CSS work for 40+ hours/week and my main tools are CSSEdit (for writing CSS), TextMate (for HTML and all other code), and Firefox plugins like FireBug and the Web Developer Toolbar. Other helpful apps include xScope (indespensible for quickly measuring screen dimensions, zooming-in, grabbing colors, etc.)

Also I find putting the design comp behind the HTML very helpful (as I explained here). And there's other tools (such as pixelperfect or XRAY) that will put the design comp on top of the HTML.

There are a lot of tools for converting pixels to ems, but I'm a bit biased toward my own EmChart.

Not specific to CSS, but having a really good FTP client also helps.

Answered almost 10 years ago by Andy Ford

TopStyle Pro for windows comes with some useful Site based CSS utilities built in - like finding orphan rules and unused styles etc.

This is neat:


as is:


Answered almost 10 years ago by Tony Crockford
danwellman 5600

DustMe Selectors is a firefox plugin that finds unused selectors in stylesheets...Pretty useful

CSS Validator is a plugin for Firefox that validates using the W3C Jigsaw CSS validator

YUICompressor compresses CSS files (and JS files). It's a command-line app but very easy to use and effective

Answered almost 10 years ago by danwellman

Altova's XMLSpy is able to work with CSS files reasonable well, and is also used for editing HTML/XML files and lots of related file formats. It's not free and not small, though.

Xara also created a few useful tools to use. I used to use this about 5 years ago, but the product I had then isn't sold by that name anymore. (Don't even remember it's exact name.)

Answered almost 10 years ago by Workshop Alex

This is useful too: http://gallery.theopalgroup.com/selectoracle/

"Ever wondered what a particularly complex CSS selector really means? Here's your chance to find out! Simply enter one or more semi-colon separated selectors or rulesets into the following "Direct Input" area, or provide the URL of a stylesheet in the "URL Input" area. Best of all, the SelectORacle will flag potential errors and other problems, and it won't choke on any actual rules. You've always wanted to know what makes those line-noise posers tick-- now you can."

Answered almost 10 years ago by Tony Crockford