ASP.net and css styles

Question

can some on help me on how i can reference images i have all my images stored in an image folder which is located in the root folder (..\images) in my css class i have the the following

#image
{  background-position: left;
  background-repeat: no-repeat;} 

.background
{
  background-image: url(..\images\image.gif);
}

and in my .cs file i have

image.Attributes.Add("class", "background");

image is a div tag which is in my aspx code !!

when i run this code i image doesnt show, any ideas what i might be doing wrong

Answer 1

You should turn those slashes in your paths around from \ to /

Also, I usually put an url keyword before the parenthesis in CSS, but I am not sure if this is required:

background-image: url(../images/image.gif);

---

UPDATE: If the image field in your C# code is some kind of webcontrol, say an Image control, you should use the setts on its CssClass property rather than explicitly adding a class attribute. What you are doing now might yield two class attributes in the markup, which might not get handled well. You can do a quick "view source" on your page to test if this is the problem.

If this does not help, see Nick Cravers answers. The path from your CSS to the image is wrong, or the image file is not where you believe it is.

Answer 2

URL references in a CSS file must be relative to the CSS file.

Make sure that compared to the CSS file the image is in ..\images, if not, adjust it to be in relation to the CSS.

Also your background declaration should be like this:

background-image: url(..\images\image.gif);

Example:

CSS = \CSS\styles.css
IMG = \Images\image.gif
Style = url(../Images/image.gif);

CSS = \styles.css
IMG = \Images\image.gif
Style = url(Images/image.gif);

Answer 3

The style definition:

background-image: url(../images/image.gif);

is saying "go up one directory and into the images folder". Try:

background-image: url(/images/image.gif);

This assumes that the images directory is in the root of your website.