Got the love bug for Firebug (and Web Developer too)

If you develop and trouble-shoot a lot of web sites that use CSS, then there are two Firefox Add-on plug-ins that you have to use and will ultimately “CANNOT” live without.

Web Developer
by Chris Pederick
Adds a menu and a toolbar with various web developer tools such as finding broken images, resizing browser, colour info, etc.

If you need HTML, CSS, images (broken), or even JavaScript information about a web site, this tool does it all. Play around with it, you will see what I mean.

Firebug
by Joe Hewitt
Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page…

Oh…for all those times where a web site uses multiple, multiple CSS files and you can’t figure out which CSS element is being used and which CSS file it is coming from. Just hover over an element and Firebug will show you which CSS element is being used.

One Comment Add yours

  1. R. Turgano says:

    For debugging/designing in IE, there is a Internet Explorer Developer Toolbar as well:
    http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en#Instructions
    Works in IE7 and has a nifty right-click “Trace Style” when you click on the Current Value under Current Style >Property window.
    Instructions
    After installing the Developer Toolbar, restart Internet Explorer and click the Developer Toolbar icon in the command bar to display or hide the Developer Toolbar.
    You can also open the View menu and then use the Explorer Bar menu. In Internet Explorer 7, open the Tools menu and then use Toolbars->Explorer Bars to display or hide the Developer Toolbar.

    Like

Leave a comment of question

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.