views:

29

answers:

1

I am using codeigniter.

My products page shows all the products we have and then users can click on each product_name to get more details about that particular product. So, I have declared products as the class and product_name as a function within the product class - so I could get the url www.company.com/products/product_name.

When I go to www.company.com/products everything is fine but if I add a trailing slash so it looks like www.company.com/products/ my window underneath the logo and menu moves over it hiding both the logo and menu. The same happens when I go to www.company.com/products/product_name.

How can I make sure that the window below does not hide when I add trailing slashes or when I go to product_name pages.

Any help would be appreciated.

+1  A: 

The problem is that you have specified a relative path for your images. You need to make them absolute, or at least relative to the current location. That is to say, if you change your image path from:

<img src="images/obsia.png">

to

<img src="/images/obsia.png">
or
<img src="http://www.obsia.com/images/obsia.png"&gt;

Your problem will be solved.

The reason this is happening is because the path to the images is determined by the base URL. When you are at http://www.obsia.com or http://www.obsia.com/products, your base URL is http://www.obsia.com.

To the browser then images/obsia.png is rendered as http://www.obsia.com/image/obsia.png, which your server interprets as wwwroot/images/obsia.png and the relative link works.

However, if you do http://www.obsia.com/products/ your base url is http://www.obsia.com/products and the relative path for your images changes from http://www.obsia.com/images/obsia.png to http://www.obsia.com/products/images/obsia.png. Your server interprets this as , which your server interprets as wwwroot/images/products/obsia.png, which is not a valid path. The server returns a 404 --resulting in broken images.

You can see this if you use Firebug's .Net panel. The request for your logo returns:

GET obsia.png
http://www.obsia.com/products/images/obsia.png

404 Not Found

obsia.com

539 B
Sean Vieira
It shows up broken links on safari. On firefox it just dsnt show.I tried the suggestion you made, but can't seem to get it to work. Also, I have done the same thing for www.obsia.com/products and that seems to work fine. Not sure why trailing slash would change the styling? I took out the window and did see both the logo and menu where the window originally was. So it seems like it just moves up hiding it (I have to figure out what is going on in Safari though).
strangeloops
strangeloops ... I've updated my answer to try to clarify. The page as it currently stands *does not* work in any of the 5 major browsers. (IE, Firefox, Safari, Opera, or Chrome)
Sean Vieira
ohhh wait that makes sense - its because the image is on www.obsia.com/images/obsia.png which is in the header_view.php.The image shows up on www.obsia.com/products but does not show up on www.obsia.com/products/? Any hints now. BTW thanks for working with me.
strangeloops
strangeloops; yes, one hint. :-) Change `src="images/obsia.png"` to `src="/images/obsia.png"` in your `header_view.php` file, and all should work.
Sean Vieira
ohhhhh I am so so sorry, I feel like a complete idiot - I was adding the /images elsewhere thats why it wasnt working! Thank you so much - you are a patient man :)
strangeloops
strangeloops. Glad to help!
Sean Vieira