Skip to content
Derek Jones edited this page Jul 4, 2012 · 6 revisions

Category:Help::TipsAndTricks | Category:Help::CSS When using CSS in your site it is usually best to place all CSS code in separate files and include them using a link in your head tag.

<link rel="stylesheet" href='css/fonts.css' type="text/css" media="screen, projection" />

With Code Igniter if you are using the [url=http://codeigniter.com/user_guide/general/urls.html]apache mod_rewrite rule[/url] to remove the index.php file from your urls you need to change the rule to allow any linked css files to be loaded. By default the rule will re-direct any url that does not include the text "index.php", "images", or "robots.txt" to your default controller.

Default rule.

RewriteEngine on
RewriteCond $1 !^(index\.php|images|robots\.txt)
RewriteRule ^(.*)$ /index.php/$1 [L]

Modified rule to allow loading css files.

RewriteEngine on
RewriteCond $1 !^(index\.php|images|robots\.txt|css)
RewriteRule ^(.*)$ /index.php/$1 [L]

To make for more portable code use the url helper class to link your css file.

Load the url helper class in your controller.

$this->load->helper('url');

Then use the url helper to link your css file.

<link rel="stylesheet" href='<?=base_url()?>css/reset.css' type="text/css" media="screen, projection" />

Further Reading [url=http://httpd.apache.org/docs/2.0/mod/mod_rewrite.html]Apache Mod_Rewrite[/url] [url=http://www.regular-expressions.info/]Regular Expressions[/url]

Clone this wiki locally