Where to put CSS files

From Joomla! Documentation

Where to put your CSS files depends on what you would like to achieve with them.

1. Template The CSS within the template folder is meant to be globally valid for the whole site. That means the CSS is not only authored for one specific component or module within Joomla! but for the whole installation. So you might want to choose this location for your CSS files while creating a new template or modifying an existing one.

2. Component or Module Creating a new component / module you might want to keep the CSS files with the component/module so that everything displays nicely no matter where it is going to be installed later on. One place for the include statement can be the main component file of your component/module folder. Creating a CSS folder within your component/module folder structure and using the following code works fine for components and modules:

$document = &JFactory::getDocument(); $document->addStyleSheet('components'.DS.'com_xyz'.DS.'css'.DS.'xyz.css');