sugarenia.com

The Problem

If you’re like me, you often use Macromedia Dreamweaver 8 to quickly edit the CSS you create (on a break from excellent TopStyle Pro from Bradbury Software).

Dreamweaver offers a good deal of code hints, which can be particularly handy when authoring CSS. One of the attributes I (and by I, I mean everyone) use the most is the “padding” one. Everyone loves paddings, no? Paddings are cutier than margins.

Since the padding attribute does not have specific values that can be applied to it (like in “font-size: small” for example), Dreamweaver automatically displays only “inherit” as its code hint. In addition, I (and by I, I hope everyone) extensively use tabs to indent my code.

So that’s what happens : you write “padding:”, you press Tab, “inherit” is the default option, you press Tab again (because one can never be enough) and voila! Dreamweaver decides that padding: inherit looks better on your CSS document, and writes so.

This has repeatedly led me to a) crying out loud b) ripping my hair off c) making ridiculous finger acrobatics with the arrows and Tab buttons to avoid auto-completion, adding up to the pain of my poor, strained wrist. This had to stop. This had to stop without disabling auto-completion.

The Solution

Thank God for Dreamweaver XML configuration files. A little search around Dreamweaver live docs, and the answer is right there.

Browse to %yourDWfolder%/Configuration/CodeHints folder. There you’ll find a single XML file called CodeHints.xml (inspired, no?). If you’ve never concerned yourself with XML in the past, fear not, we will not go deep. So, open the file in your favourite editor (hey, maybe DW will do – haha). Around line #5363, you’ll find the following lines :

Click on the image to enlarge

See the evasive “inherit” menu option? Good. So now we have two options : either we delete the thing, forget about inherited padding and go to sleep, or we burn with remorse and leave the darn thing, only to add another option and avoid the auto-selection because it’s the only option. I’ll show you how to do both, but it’s really up to you.

Don’t forget to make a copy of your file before you edit it, so you’ll be able to get it back if things go terribly wrong (they won’t, but do it anyway).

1. Delete “inherit” option : For all the “padding” attributes (padding, padding-top, bottom, left and right) delete the line that lies below. Also, because we are XML monsters, since the tag is empty, delete the ending tag and add a forward slash (/) just before the end of the menu line (before the closing >). This should leave your padding lines look like these :
   
   Click on the image to enlarge

2. Add a foo option so that “inherit” is not automatically selected: Copy the line of “inherit”, and paste it just below it, changing label=”inherit” to whatever you like. Like label=”inherit2″ or label=”foo” or label=”George”. Do that for all the padding lines, and your XML file will look like something like this:
   
   Click on the image to enlarge

Save and close the file, restart DW, and never worry about auto-inherited padding anymore.

P.S. If you’ve got another way to deal with this particular problem, I’d be thrilled to know.

dreamweaver, code, CSS, code hints, customization