I created an ASP.NET Framework MVC website (https://realtimeceap.brc.tamus.edu) with
background image. The following are my CSS and HTML code snippets:
~ is a server side notation for the application root that needs to be processed to produce the correct url ( ie /images/farm1.jpg or /folder/images.farm1.jpg).
Try <img runat="server" src="~/images/farm1.jpg" /> and use "view source" to see what is rendered. If I remember server controls (with runat="server") are processing that kind of url automatically for you to produce the correct client side
url.
Ah sorry I missed this is MVC (which already process this kind of Url).
What if using F12 Network to see if the http query that retrieve the image works fine or shows some error (404 not found ?)
IMHO it's best to always use this kind of tools to see what happens rather than reading the code and wondering which wrong thing(s) could happen. I tested your CSS and all works fine here.
I do use F12 to look at the DOM Explorer. Also checked other tabs including the Network tab. No error at all. I'm thinking there must be some other settings that's clashing somewhere.
Member
63 Points
336 Posts
Background image not showing in IE v11, Windows 7 and 10
Oct 24, 2018 01:29 PM|mgambone|LINK
I created an ASP.NET Framework MVC website (https://realtimeceap.brc.tamus.edu) with
background image. The following are my CSS and HTML code snippets:
CSS:
/*******Set background image at full size always**********/
#bg {
position: fixed;
top: -50%;
left: -50%;
/*preserve aspect ratio*/
width: 200%;
height: 200%;
z-index: -100;
}
#bg img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
min-width: 50%;
min-height: 50%;
display: block;
}
HTML:
<body>
...stuff here...
<!--Background image-->
<div id="bg">
<img src="~/images/farm1.jpg" />
</div>
</body>
The background image displays in latest Chrome, Firefox, Edge and Safari.
Any idea why it's not showing up?
Appreciate any help.
All-Star
43240 Points
14959 Posts
Re: Background image not showing in IE v11, Windows 7 and 10
Oct 24, 2018 01:36 PM|PatriceSc|LINK
You likely have more modern stuff such as https://www.w3schools.com/csSref/playit.asp?filename=playcss_background-size&preval=cover
~ is a server side notation for the application root that needs to be processed to produce the correct url ( ie /images/farm1.jpg or /folder/images.farm1.jpg).
Try <img runat="server" src="~/images/farm1.jpg" /> and use "view source" to see what is rendered. If I remember server controls (with runat="server") are processing that kind of url automatically for you to produce the correct client side url.
Member
63 Points
336 Posts
Re: Background image not showing in IE v11, Windows 7 and 10
Oct 24, 2018 03:38 PM|mgambone|LINK
Response to PatriceSc:
Thanks for responding. I tried what you suggested. It still doesn't display the image.
All-Star
43240 Points
14959 Posts
Re: Background image not showing in IE v11, Windows 7 and 10
Oct 24, 2018 04:03 PM|PatriceSc|LINK
Ah sorry I missed this is MVC (which already process this kind of Url).
What if using F12 Network to see if the http query that retrieve the image works fine or shows some error (404 not found ?)
IMHO it's best to always use this kind of tools to see what happens rather than reading the code and wondering which wrong thing(s) could happen. I tested your CSS and all works fine here.
Member
63 Points
336 Posts
Re: Background image not showing in IE v11, Windows 7 and 10
Oct 24, 2018 07:57 PM|mgambone|LINK
Hi,
I do use F12 to look at the DOM Explorer. Also checked other tabs including the Network tab. No error at all. I'm thinking there must be some other settings that's clashing somewhere.
Will check it out some more.
Thanks.
Participant
840 Points
295 Posts
Re: Background image not showing in IE v11, Windows 7 and 10
Oct 25, 2018 07:13 AM|Jenifer Jiang|LINK
Hi mgambone,
I've opened your website on my side and it seems that the background image shows well.
Best Regards,
Jenifer
Member
63 Points
336 Posts
Re: Background image not showing in IE v11, Windows 7 and 10
Oct 25, 2018 12:23 PM|mgambone|LINK
Hi,
May I know what version of Internet Explorer you have and Windows OS version?
Thanks.
Participant
840 Points
295 Posts
Re: Background image not showing in IE v11, Windows 7 and 10
Oct 26, 2018 03:05 AM|Jenifer Jiang|LINK
Hi mgambone,
I'm sorry that I just test your website in IE11. And I've found that the issue is due to the image itself.
You should make sure that you didn't use the CMYK colorspace when creating the image, which IE can't handle.
Saving it in RGB colorspace should fix the problem (for example, in Adobe Photoshop, use the "Save for web..." option).
I've tried resaving the image, and it indeed works now in IE for me.
Best Regrads,
Jenifer
Member
63 Points
336 Posts
Re: Background image not showing in IE v11, Windows 7 and 10
Oct 26, 2018 12:41 PM|mgambone|LINK
Hi, Jennifer,
Thank you so much. Got it to work.