Magento is a powerful platform, but there are several free or low-priced tools on the internet which can be downloaded in order to save time and enhance your understanding of Magento. We’ve provided a list of them below, and we hope you’ll find them incredibly useful!

Part 1: Magento Themes – Getting to the Core of CSS

Development on Magento has continued again, and this week I’ve been changing a lot of niggly design elements, including adjusting the Cascading Style Sheets, which help to create the overall look and feel of the web-site.

As mentioned before, Magento has an interesting architecture – with pages being populated by a plethora of hierarchical folders, XML files, database content, static objects etc – therefore sometimes it is pretty difficult to track down which include helps to create the design.

I’ve discovered a Firefox tool called Firebug, which is absolutely superb for changing the CSS!

Definitely definitely download this tool – it will save you hours.  Once installed, it really is so very easy.  If you have an element on the home page that you wish to change, say for example, the “Compare Products” heading, simply highlight it, right click it, and select “Inspect Element”.

The line of code that creates the particular element is then highlighted in the window below, and then when you double-click this code, it highlights the particular CSS file and line of code from where the elements’ attributes come from – which means you don’t have to spend hours finding the class in the stylesheet.

Source: Blastedthing