Using Theme Developer and Firebug to Debug Drupal Themes
UPDATE: Firebug is not supported anymore. Please try Dev Tools in Firefox, or Developer Tools in Chrome instead.
There are several tools that that makes designing for Drupal much, much easier.
In particular, we recommend the Theme developer module and also Firebug.
Many of you may know about Firebug already. It’s a browser tool that allows you to inspect any CSS, HTML or JavaScript elements.
Think of Theme developer as a Drupal-specific version of Firebug. Using Theme developer you can click on any element of your Drupal site and get a breakdown of how it was built.
This video is part of complete Drupal theming video class.
Note: please make sure to install and older version of the simplehtmldom API module. You need version 7.x-1.12, not the latest release.