CODEWITHSUNDEEP
cssiisasp.net-core
Mkalafut
Mkalafut

Reputation: 741

Image in site root renders locally but not on IIS server

I have a site that is using a static image as a background. When I run the site locally the page renders with the image (located in the project's wwwroot/images/BrickWall.jpg), but when I publish the site to a test server, the image is sent with the site and located in the correct folder on the server but the page doesn't render the image.

When I run the test server's site, enter developer tools (F12) and change the image url from

url("/images/BrickWall.jpg");

to

url("/Dashboard/images/BrickWall.jpg")

the image works. I can also navigate directly to the image on the test server via the browser on my local machine - so the file is definitely there and accessible.

Here is the code

My razor view:

<body class="image-background">
    <form method="post">
      ...
    </form>
 </body>

My CSS

.image-background {
    background: url("/images/COTGBrickWall.jpg");
}

How can I code this in a manner so that the same code will refer to the path of the image on my local machine but also to the correct directory on the various servers it will go to?

Edit: Here is the folder structure inside Visual Studio

enter image description here

Upvotes: 0

Views: 1820

Answers (1)

Fabricio Koch
Fabricio Koch

Reputation: 1435

Modify your css to:

.image-background {
    background: url("../images/BrickWall.jpg");
}

Upvotes: 1

Related Questions