I’ve finally found an editor that produces CSS in the following style:

I’m not going to argue the case for this structure, since there are as many ways to write CSS as there are Web developers, each fiercely defended by its respective author. We find the above layout highly readable during development and I’m sure we’re not the only ones.

PSPad to the rescue

While PSPad doesn’t offer some of the complex functionality in Eclipse and other Web development IDEs, it is fast, stable and minimalist – and freeware. There are plugins for HTML tag completion, a built-in FTP client, clever multi-language highlighting – and best of all – definable language auto-completion.

The difficulty in automating the above CSS layout is that properties require a different number of tabs depending on their length (‘color’ requires five tabs before its value, ‘position’ four tabs, ‘text-decoration’ one tab). PSPad lets you define these once and automates it from there on with Ctrl + Space.

Try it out: auto-tab your CSS values

If you’d like to try it out, download PSPad then grab my PSPad CSS definition file, unzip and copy into ‘C:\Program Files\PSPad editor\Context’ (created for version 4.5.4)

Tags: css, programs