Error with including stylesheet

[eluser]Tanax[/eluser]
Hi!

First of all, I have to say that I did not search for this on the forums, maybe I should've done that.

Anyhow!
I got a stylesheet, that I'm including in my header view:

Code:

<link rel="stylesheet" href="stylesheet.css" type="text/css" />

Simple.
It works GREAT when I'm on index:
http://localhost/

Btw, the stylesheet is in the same location as the index.php

It doesn't work when I'm navigating to the index:
http://localhost/site/index

I set the site to be default controller, and I allowed the stylesheet in the .htaccess:

Code:

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

Also worth to mention is that the controllers and URL thing works perfectly well. I see the view and everything. Only problem is that the css doesn't get applied to the pages if I go the controller via URL.

Any suggestions? Thanks in advance!

[eluser]jedd[/eluser]
Hi Tanax, and welcome to the forums.

You might want to experiment, in your view, with the CI function [url="http://ellislab.com/codeigniter/user-guide/helpers/html_helper.html"]link_tag[/url] (note that you'll need to also include the HTML helper to enable this functionality).

Code:

<php echo link_tag('stylesheet.css'); ?&gt;

This produces the necessary link, and handles the right path info etc.

If this doesn't work, post the page-source as your browser sees it, for the stylesheet link.


A common practice around here is to put your stylesheets, javascript, images etc as sub-dirs under a top-level directory called assets - and obviously you'd change your htaccess to reflect this, eg.

Code:

RewriteCond $1 !^(index\.php|assets|robots\.txt)

[eluser]bretticus[/eluser]
I think using CI tools to render the path correctly is great and all, but this is simply a path issue. I am not saying to not use jedd's suggestions. In fact, I am supporting them. I just wanted to demystify the issue as you can fix this by inserting a / in your path.

Code:

<link rel="stylesheet" href="stylesheet.css" type="text/css" />

Notice your href is simply stylesheet.css. That means look in the current directory for a file called stylesheet.css. That works fine when that file is in the virtual root folder and the browsers path also happens to set to the virtual root folder (ie. http://localhost/ -- the trailing slash which is optional means that is the root for that website.) However, when you add controller + action, it appears to your browser(as it is intended) that you are now in the action folder of the controller folder. When you simply supply:

Code:

<link rel="stylesheet" href="stylesheet.css" type="text/css" />

The browser requests http://localhost/controller/action/stylesheet.css which clearly doesn't exist. Therefore, when using controller action frameworks, it's a good practise to use the absolute virtual path. For example, just placing a root slash (/) in front of your path to the style sheet:

Code:

<link rel="stylesheet" href="/stylesheet.css" type="text/css" />

will instruct the browser to always search the virtual root of the website for that file no matter where the browser thinks you are. The assets idea is a great idea (and apparently the standard for CI development.)

Hope that all made sense.

Good luck

[eluser]Tanax[/eluser]
Thanks for welcome!
Thanks alot for the link_tag function, worked like a charm!
And yes, I initially had it in my "images" folder, however since that didn't work I tried moving it up from the directory to the index.php dir.

Thanks for the tip about assets folder and about the paths tips from bretticus!

Fast replies, I love codeigniter