Web Dev, Linux, WordPress & More

Firebug for Firefox

by eric on January 17th, 2007 in: Web Design

If you’re a Firefox user and design websites, definitely check out the FireBug extension for Firefox. According to the Mozilla site:

FireBug [has] all of the tools you need to poke, prod, and monitor your JavaScript, CSS, HTML and Ajax are brought together into one seamless experience, including a debugger, an error console, command line, and a variety of fun inspectors.

FireBug | Firefox Add-ons | Mozilla Corporation

Firebug Web Developer Extension for FirefoxI’m still learning all of Firebug’s features, but so far, I’ve found the Inspect mode extremely helpful.

Using the Inspect tool, you can click on any item on a web page and see associated CSS and HTML and allow you to easily see the cascade of styles and find the areas in the stylesheet that apply.

Also, you can make real-time edits to the markup or styles and see the results in the browser.

That may not sound so hot, but if you’re new to CSS, or are working with multiple, or complex, stylesheets, it can spare some hair pulling.

One word of warning: be careful using both the Web Developer Toolbar and Firebug at the same time. If you’re using both plugins in the same window and editing CSS, be careful not to click page links or you’ll lose your changes.

For more info on Firebug, visit:

technorati tags:, , ,

Leave a Reply

%d bloggers like this: