0

For example i have this line in my css file to load an image. It is a label icon in the sidebar. 

background-image:url(../assets/images/icons/arrow_state_grey_expanded.png);

Since it is relative path, sometimes when i open a certain page, it cant find the image to load.

Example 1 (can load image)

http://localhost/portal_dev/subkeyword_view/add_subkeyword

Example 2 (cannot load image)

http://localhost/portal_dev/subkeyword_view/view_subkeyword/20/20

How to solve this problem beside move the image to root project folder? FYI, i am using codeigniter 2.0 in my project. Usually for php i will just called the full path of the image file.

UPDATE

Since CSS file URLs are reflective to the location of the CSS file, my css is loaded correctly, and the problem happen only when the current url contains parameter (see example 2), i think the problem is something to do with CodeIgniter not the css.

cyberfly
  • 5,568
  • 8
  • 50
  • 67
  • Urls are relative to the location **of the CSS file**, so if the CSS file was loaded correctly, the images should be fine. – Kobi Sep 19 '11 at 05:25
  • the css was loaded correctly since no error in firebug. somehow when visiting the 2nd url, the image will not be loaded (it is an icon in the sidebar) – cyberfly Sep 19 '11 at 05:28

3 Answers3

0

that's just a path thing, make sure the headers of your page reflect the exact location of the CSS file and that's it OR just declare the root + subfolder(s) for CSS files

Coco
  • 66
  • 2
0

In a CSS file URLs are reletive to the location of the CSS.

So if your CSS file is in /.../css and images re in /.../assets i.e. the image path is valid from the css then the images should load.

Are youy sure the CSS is loading. In case you are not using an absolute or root relative address for your CSS I would suggest using either of them.

Other wise you can add a base tag to your HTML file, this will be effective for all your href and src attributes on the page.

I ran into a similar problem with URLs like you are describing. I used the base tag to solve my problem

danishgoel
  • 3,650
  • 1
  • 18
  • 30
  • i tried using base tag but it still cannot solve my problem. fyi i'm using html5 template in my project. – cyberfly Sep 20 '11 at 02:09
0

considering your css folder is in the location

http://localhost/portal_dev/assets/css

specify the image url path as below

/portal_dev/assets/images/
Bala
  • 691
  • 5
  • 10