Firebug for Firefox | Awesome

What is firebug you ask? It really might turn out to be the best web development extension for Firefox ever made. This is a must have that no Web developer should do without. I’m serious – you need Firebug. Since I have been more active on the web development scene, I have used only two tools to create, interrogate and fix web sites. Firefox and it’s Web Developer extension, and UltraEdit, the king of all text editors (in my humble opinion.) Occasionally I will use TopStyle to more in depth css design, but after my most recent rebuild I have not installed it and have never missed it.

Firebug lets you view and edit the HTML and CSS of any page. It tells you exactly which CSS rules affect the styling of the element you select in the style inspector – not only which rules affect it directly but also which rules it inherits properties from. It lets you edit anything and toggle CSS on and off, with the results immediately showing on the page. It allows you to actually view the javascript that is loaded via an server side include, which the Web developer extention do not do.

That is only a very small portion of what this extension can do, and it is pretty much the best tool I have ever used. Given the fact that I have really only been playing with it for a few weeks and I’ve really barely touched the full capabilities of what it can do. Oh did I mention it is FREE?

Go get it and let me know what you think…

Get Firebug: http://www.getfirebug.com/

5 Responses to “Firebug for Firefox | Awesome”


  • I have this too. It’s really good.

  • so….i’m kind of new to the whole idea of firebug…and how does it save changes that i make? i downloaded it specifically because firefox displays some special characters that are not displayed in any other text editor…
    i can see the characters before my dtd in firebug, and delete them and i can’t save it afterward! maybe i’m not technology forward enough but this is confusing to me =(

  • It doesn’t really save the changes you make unless you save them locally and then upload them to your server. If it did anyone could change your stuff!!! :)

    For css work I use it to discover what css is applied to a given element, and what file it is located in. Then I can preview the changes or tweaks I want to make (in a totally safe environment) and then I make those same changes on the server side copy.

  • So how do i save it….can anyone please tell me i really need it.:(:(:((L)

  • Personally I use Web Developer extension to EDIT my css. Using this tool you can just flat out copy the css you have edited and paste it anywhere. I will check when I get home on how to do this with firebug!

Leave a Reply