This is the number one tool that I would recommend for anyone who wants to really learn how to code. I teach quite a bit of Dreamweaver and also use Coda in my classes, but this plugin is so handy for everyone, whether you are a beginner or a more advanced developer. It’s free and easy to install onto Firefox.
You can use firebug to take a look at how the CSS effects the different divs and layout elements on the page. Turning things on and off in firebug in the CSS panel (or HTML) will show you how each line of code will affect the layout, widths, heights, fonts and colours of the page design.
If you are a more advanced developer and are trying to troubleshoot a problem in your code this is very helpful to tweak the design of your site as it will also give you the exact line of code that you need to edit, as well as the document file name. That’s a huge time saver and instead of hunting for where your h3 tag is defined in your CSS sheet you can go directly to that line of code and edit your style quickly and efficiently.
