Graphics not loading from CSS file in my ASP.NET page

Question

I have this index.aspx page that isn't loading graphics from the CSS. The text 'Test' is loading fine.

What am I doing wrong?

ASPX

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="index.aspx.cs" Inherits="chinatownexperience.index" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="css/main.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div id="body-1">
        <div id="topblank"><p>test</p>
        </div>
    </div>
    <form id="form1" runat="server">
    </form>
</body>
</html>

CSS:

html,
body {
    margin:0;
    padding:0;
    color:#000;
    background: #9c0000;
    background: url('images/Chinatown-lgebg.png') left top; 
}

#body-1 {
    width: 880px; height: 1500px;
    margin: 0px auto;
    padding: 10px;
    overflow:hidden; 
}

#topblank {
    float: left;
    width: 880px;
    height:266px;
    background: url('images/WebsiteTop.png') repeat-y left top;
}

I must be missing something silly?

added a / to each image url and it worked. Sorry guys should have tested this before. — TeaDrinkingGeek
– TeaDrinkingGeek, Commented Oct 8, 2012 at 12:56
^ 3.bp.blogspot.com/-hi5TFP-EQ1c/UFSn8-dxF_I/AAAAAAAAAGk/… — Ahmad Alfy
– Ahmad Alfy, Commented Oct 10, 2012 at 12:18

Saeed · Accepted Answer · 2012-10-08 13:01:15Z

1

for this examples u can addressing from root and dont use single cot like this

background:url(/yourProjectRoot/cssFolderNameOrFile.../yourImage.*)

answered Oct 8, 2012 at 13:01

Saeed

3,8653 gold badges28 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

SpaceBeers Over a year ago

Are you suggesting putting the image in the CSS folder?

Ahmad Alfy · Accepted Answer · 2012-10-08 12:50:12Z

0

The path to the images must be relative to the location of the CSS file not the HTML/ASP/whatever file. You should point to the correct location of the images.

Example :

if you use directory structure like this :

- root\
|- css\
|- images\
page.extension

Then the path on the CSS file should be :

background: url('../images/whatever.png');

answered Oct 8, 2012 at 12:50

Ahmad Alfy

13.4k6 gold badges70 silver badges105 bronze badges

Comments

SpaceBeers · Accepted Answer · 2012-10-08 12:53:20Z

0

Your paths need to be relative to the stylesheet, not the root.

root 
  -css/styles.css
  -images/
  index.html

So if you had the above structure you would need this in your CSS

background: url('../images/your_image.png');

(worth noting that .htc files in CSS should have a path relative to the root. Handy for old browser fixes)

answered Oct 8, 2012 at 12:53

SpaceBeers

14k6 gold badges50 silver badges64 bronze badges

Collectives™ on Stack Overflow

Graphics not loading from CSS file in my ASP.NET page

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related