CODEWITHSUNDEEP
htmlasp.netcsscross-browser
PushCode
PushCode

Reputation: 1439

Background image not visible in the browser

I created a simple aspx page and I assigned the background image for my page using css as below:

html {
    background: url(Images/backImage.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

The styles are in the style tag with the aspx page itself. I can see the image in the designer, but when I open the page in browser, I am not able to view the image. It happens in all the browsers I tried. What am I missing here?

Upvotes: 0

Views: 125

Answers (3)

PushCode
PushCode

Reputation: 1439

I found it. Its not actually related to css. I am using forms authentication in my web application I have set protection to all my resources as:

<forms name=".ASPXFORMSDEMO" loginUrl="logon.aspx" protection="All" path="/" timeout="30" />

I realised that I need allow unauthenticated users to access images folder and added the following in my web.config after the system.web tag:

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

Thank you all for your quick replies and I am sorry for missing out the details in my actual question. I didn't really thought it was related to authentication.

Upvotes: 0

Travis
Travis

Reputation: 2245

If you are in a Linux environment your directory file name need to be case sensitive.

If your image directory on your server is "images" then "Images" wont work. I have pulled my hair out on that one a few times.

Upvotes: 0

Automate This
Automate This

Reputation: 31364

edit: You need quotes

background: url("Images/backImage.jpg")

Also try Fully qualifying your url to the image.

Upvotes: 1

Related Questions