Firefox 11 released, includes handy developer features

Mozilla has released Firefox 11 to the public, loaded with all sorts of enhancements, bug fixes and other updates, which you can view on the official release notes page.

The two things that have been added that mean to the most to me, are:

• Style Editor
• Page Inspector 3D View

The style editor allows you to make changes to your sites CSS styles on the fly, which enables quick testing of changes to specific elements.

1. To use the style editor, simply right-click any element on a webpage and select "Inspect Element":
   
2. Your selected element will now be highlighted:
   
3. Click the "Style" button at the bottom right to open up the Style Editor:
   
4. Your selected element's style will be displayed on the right-hand side:
   
5. Change (for example) the colour of our element from 'inherit' to pink:
   
6. Your change will instantly be viewable:
   

The Style Editor allows for rapid changes and development of your CSS code and should help cut down on the 'make change; save; refresh' cycle that most of us follow when developing a CSS stylesheet for a website.

Finally, if your layout-heavy site is full of <div> elements, you know that you can sometimes lose track of the different elements and exactly where they fit in the hierarchy and which one is nested in which. Mozilla decided to tackle this issue too... visually.

Remember those three buttons on the bottom right? Click the '3D' one now...

Behold! Geekworld in full 3D glory... or something. (Click the image for a larger version).

As you can see, all the nested elements are laid on top of one another. Clicking on an element will display it's position in relation to other elements on the fishbone layout on the bottom:

Also remember that you can open up the Style Editor while you're navigating your website in 3D mode.

Once again, Mozilla is innovating and they have made a great browser, even better. These changes are most certainly not the only changes they've made and I suggest you download a copy of Firefox to find out for yourself just what a great browser it really is.