CSS Problems? Download Firebug
A few weeks ago I stumbled on a Firefox plugin called Firebug. I don’t too much design work, but the plugin looked interesting so I installed it and didn’t really give it a second thought.
When I was redesigning WageRank I ran into several issues getting the layout to look the way I wanted. I found Firebug mentioned in one of the tutorials I was reading and I remembered that I already had it installed and began using it.
I really didn’t take advantage of all the functionality that Firebug offers, but what I did use helped me tremendously.
If you’ve ever messed around with your Wordpress template, you know that some of the CSS divs are opened in one file (index.php, for example) and closed in another (sidebar.php). This makes it difficult to find out why something isn’t lined up properly.
When you open Firebug it lets you drill down into the page’s stylesheet and see how everything is laid out. When you click on a div in the Firebug window, that area of the screen is highlighted. If you want to see what a quick change would do, you can edit the code in the Firebug window and the changes are instantly displayed on the screen. All this makes troubleshooting very intuitive.
I also know that Firebug lets you troubleshoot JavaScript, but I haven’t used it for this yet.
Now that I’m vaguely familiar with the interface I can start using it on other people’s sites to see how they are using CSS to do certain tricks.
If you do any of your own design work, download Firebug now. It’s an invaluable tool for troubleshooting your own CSS and learning your competitors tricks.
Related Posts
The RIAA Is Coming Around
How To Submit Forms With PHP
Filing Taxes For An S-Corp
How I Set Up A Private Anonymous Proxy
How To Create A Sitemap For Wordpress Blogs
