Image relative path in css

Question

I,am developing an Asp.net website and have struck in an surprise thing. My Folder structure is as shown below:

- Styles
        - master.css
        - Images 
-webPages
-scripts

Now when i try to access an image in images folder from css, i get "Failed to load resource: the server responded with a status of 404 (Not Found) " error in chrome. The error only comes from the css file. I have used some images in my asp.net pages.It is working fine there.My example code for accessing an image in css is below

a.close { background-image: url(/images/close-arrow.png); background-position: left center; padding: 0 0 0 25px; }

I cannot understand what the problem is. Please Help me to sort this problem. Thanks in Advance

Try removing the forward slash before images. – gaynorvader Dec 02 '13 at 10:17 — gaynorvader, Dec 02 '13 at 10:17

score 1 · Answer 1 · answered Dec 02 '13 at 10:17

1

You have to mention path as background-image: url(./images/close-arrow.png);

because this is relative path.

answered Dec 02 '13 at 10:17

Kishori

1,065
6
12

Try background-image: url(../images/close-arrow.png); – Kishori Dec 02 '13 at 10:29
refer below links, it might solve your problem. http://stackoverflow.com/questions/2874018/relative-path-not-working-for-images-in-css and http://stackoverflow.com/questions/2405333/css-background-image-path-issues. – Kishori Dec 02 '13 at 10:32

score 0 · Answer 2 · answered Dec 02 '13 at 10:18

0

/images/close-arrow.png is not really a relative path. The leading / tells the script to start from your webroot. Just remove it and it is loaded relatively from the Styles folder

answered Dec 02 '13 at 10:18

Ria Weyprecht

1,275
9
19

Is your folder really named Images with capital i? Then you should name it like that in your path too – Ria Weyprecht Dec 02 '13 at 13:53

score 0 · Answer 3 · edited Dec 08 '15 at 17:43

0

Put this code snippet in your web.config:

<location path="Images">
  <system.web>
    <authorization>
      <allow users="*" />
    </authorization>
  </system.web>
</location>

edited Dec 08 '15 at 17:43

Nathaniel Ford

20,545
20
91
102

answered Dec 08 '15 at 17:25

Mobile-DD

1

Image relative path in css

3 Answers3