Debugging in IE

As a web developer, I’ve tended to do most of my development in Firefox. I wrote a post a while back talked about how much I love Firebug — the world’s best (in my opinion) console, JavaScript, CSS and DOM debugger.

However, when one has to figure out why something looks shitty in Internet Explorer… you’re basically up Shit Creek with no paddle. (That’s technical-speak for ‘You’re pretty much fucked”)

I’ve been trying to use a tool called DebugBar in IE7, but I’m only mildly impressed. There’s no CSS or JS debugger, so I’ve only found it useful for monitoring the console. As I do a lot of AJAX work, it is helpful… and for-better or for-worse, it’s the best thing I’ve found so far.

I’ve been confounded by a CSS issue recently in IE7, so I did yet another Google search for a CSS tool that I can use in IE. As luck would have it, I did find a useful tool… one which is actually pretty ingenious.

Called Joshascript DiscHover, you simply add the link to your favorites. Once you’ve navigated to the page where you need a CSS debugger, you select the link from your favorites list…

…and nothing happens!

Just kidding. The directions on the download page are fuzzy, but once you have clicked on your “favorite” link, you can left-click anywhere on your page and a popup appears detailing the CSS of that DOM element.

Pretty cool! I’m hoping this solves my issue in IE… if this tool doesn’t help me, you’ll definitely hear about it.