flink.gr

CSSViewer is a very handy add on for Firefox, which shows the css parameters of any element in a website. If you use it once then you cannot live without it.

The bad news are that it is not compatible with the Firefox 3.5.* version, and from what I can understand there are no plans for an update.

The good news are that there is a really easy way to install it and make it work perfect in Firefox 3.5.*

1. Copy the following address to another browser than Firefox (so that the pop up installation window will not come out)

https://addons.mozilla.org/en-US/firefox/addon/2104

if you do not have any other browser installed go to

https://addons.mozilla.org/en-US/firefox/addons/versions/2104

2. Download the file cssviewer-1.0.3-fx.xpi

3. Use 7-zip (or any other extractor) to open it and extract it

4. Open install.rdf with notepad (I used Notepad++ to find easily the line I must change)

5. On line 18 you see <em:maxVersion>3.0.*</em:maxVersion> you must change it to <em:maxVersion>3.5.*</em:maxVersion>

6. Save the file and select all the files you extracted and make a zip file

7. Now you must rename the zip file including the zip extension to cssviewer-1.0.3-fx.xpi (it will prompt you if you are sure you want to change the file name extension and you must click yes)

8. Now drag n’ drop the xpi file to Firefox 3.5.* and the installation window will pop up. Install it normally ;)

I have checked it and it works great in Firefox 3.5.1

If you have any problem installing the add on or you like the tip please comment ;)

If you want to see the colors used in a website then Colorzilla add-on is the best solution. It shows the colors in RGB format and hex.

Just download it from here, after the installation a little eyedropper will appear at the lower-left corner of Firefox. Click on it and move your mouse there you want to find out the color. If you click you “lock” the color and deactivate the plug-in.

Really useful for web designers!

There is a very useful add-on for Firefox, necessary for every web designer. It is the famous Web Developer add-on.

You can download it from the official Firefox add-ons site or go directly here.

It contains many cool tools that can give you a full image of how a website is designed. One of my favorites is that you can “edit” online the css of a website and directly see the results. Another one favorite is the “Display Element Information” (under the Information menu) which does what it’ s name says. You can have all the information for every element in a website, nice and easy.

I believe that this add-on is a MUST for every web designer, so check it out!