IE Developer toolbar

I just downloaded and installed the IE Developer Toolbar and am in developer browser heaven. I have previously used the Web Accessibility Toolbar, but I think the developer toolbar is way better. Here are some of my favorite features:

DOM Browser: Browse the entire DOM hierarchy of a page using a tree control, then for individual nodes, view its attributes and also edit them. This last bit is a nice touch. If you’re trying to tweak something so it’s just right…this is perfect. You can make it work and then go fix the source.

View Class and ID Information: This is extremely useful when debugging CSS, especially for DotNetNuke skins. You see an overlay of CSS classes and element ID’s on the page making it easy to visually detect the “cascade” that might be contributing to CSS issues.

Show Ruler: This feature was not what I expected, but once I saw it I loved it. Instead of the usual horizontal and vertical rulers what happens is that your cursor becomes a cross-hair. You can then drag it from one point to another on your browser and it draws a virtual ruler between the two points (and you can create as many of these as you want). You can also click anywhere and find the coordinates of the point.

Definitely a useful toolbar to have if you are a web developer.