JoomlaJoomla Setup

Joomla – How to find which .CSS file is used

A suggestion for anyone who is interested in changing .CSS file – try out the ‘Firebug’ add-on for the Firefox browser – it is brilliant!  Once you install Firebug plugin you can ‘Inspect Element’ and see which CSS file is being used and which line you can find it on.

1.  How to install Firebug for Firefox 5.0

–  Click on ‘Firefox’, ‘Add-ons’, ‘Get Add-ons’
–  Search for ‘Firebug’, click on ‘Add to Firefox’
–  Restart Firefox and Firebug should be installed.  You will see a little Bug icon at top right corner of Firefox window.

2.  How to find which .css file is being used.

  • Browse to your Joomla website
  • Click on the Bug icon
  • Click the CSS tab on the pane that appears over the bottom half of your screen
  • Click the button with the tip ‘Click an element in the page’
  • Click anywhere on the Joomla page, and Firebug shows in a pane on the right the css code (and the .css file) that is responsible for the style.
Use Firefox Firebug to Inspect Element
Use Firefox Firebug to Inspect Element

Thanks to Tybion who commented on my post earlier.  He provided this great tip.



Leave a Reply

Your email address will not be published. Required fields are marked *

Captcha Captcha Reload