http://yuristhlm.se/testsite2/hem/
I’ve set a background image for the mobile header that doesn’t appear when I access the page on mobile devices. But it appears fine when I resize my chrome browser windows.
browser window
my iphone
Can I fix this with CSS?
Hi crewneck!
right now you are using this code for loading your background image on mobile:
@media only screen and (max-width: 767px)
.main_color {
background: #000000 url(//localhost:8888/karl20april/wp-content/uploads/2015/01/bakgrund_4_1000.gif) top right no-repeat scroll;
}
As you can see the background url is a localhost one. That is why it can’t be loaded. You should change it to the correct direction, for example like this (same as for your desktop settings):
@media only screen and (max-width: 767px)
.main_color {
background: #000000 url(//yuristhlm.se/testsite2/wp-content/uploads/2015/01/bakgrund_4_1000.gif) top right no-repeat scroll;
}
Hope this helps.
Regards,
Andy
Managed to solve it. Thanks!