Top 6 features in Firebug and Web Developer

Here are some features of Firebug and Web Developer that have been amazing tools when creating the HTML/CSS for

1.) The Style window in Firebug to see CSS inheritance, what has been overwritten and which attributes are still being cascaded, and possibly creating a mess.

2.) View generated source in Web Developer is indispensable when debugging Javascript that manipulates and creates DOM elements.

3.) Right clicking an element and choosing Inspect Element to see where it is in the DOM, and then the ability to see its size interactively (everything we hover over in the HTML view in Firebug turns blue in the window).

4.) Display element information in Web Developer is great for quickly seeing what is what and who the parents are.

5.) Resize in Web Developer is awesome when resolution testing.

6.) Firebug Console, OK this one was not a help in the current series but it must be mentioned, such a good tool for debugging AJAX.

The numbers are not by preference but merely the order these things popped up in my head they don’t signify anything. The Firebug Console is not less useful than for instance Web Developer Resize, rather the opposite.

Related Posts

Tags: , , ,