Templates FAQ: How do I find what CSS is used by...?

[kwak]

How do I find what CSS is used by...?

This is a common question.  How is the answer found?

Once you know the answer you can memorize the class and id names and tell the next person.

You can look at the generated source with View > Source to see what class and id names are used by the html sections you are interested in.

You can use one of the debug tools which has a live inspection mode.  This is the fastest and easiest way to see what CSS is actually used.  See the Template FAQ: Common HTML/CSS Debug Tools for a short list of debug tools.  For example, the Firefox add-on FireBug has a live inspection mode where you move the cursor around the web page, a box is drawn around the element of the web page, and in the FireBug window you can view (for the highlighted element) the source code, or the css (with links to the actual section in the css file), and other information.

Also look in the Templates FAQ: Base Joomla! CSS Styles for a list of all class and id names used by Joomla.

TIP:
HTML of the form class="classname" matches the CSS .classname
HTML of the form id="idname" matches the CSS #idname

[Naesstrom]

Very nice tip.. thanks!
Firebug helped me a lot!