Firebug Add-on for Firefox

I am having some hard time knowing the width (in pixels) of a section on our BGN page. I already had a screen capture and was toying around with Adobe Photoshop to know its width. Now, a colleague of mine introduced me to Firebug, an add-on to Firefox. So I googled it and went to this page: https://addons.mozilla.org/en-US/firefox/addon/1843 Installation is pretty straight forward. You just click the Add to Firefox button, then click the Install button on the following display. You need to restart Firefox after the installation and that's about it.

Making use of the add-on is easy too. You browse a web page, place the mouse over a section of the page, right click and select Inspect Element option. A display similar to the below should be seen:


As you hover the mouse to the code, the section of the page gets highlighted. You can now take a snapshot of that page, load the snapshot at Photoshop and use the Rectangular Marquee Tool to match the highlighted section of the page.

Just make sure you are viewing the Info tab of Palette Options so you can take note of the width and height:


Another added skill huh?! Thanks Mello!