Background image not displayed on some phones
Everything works fine for some phones, but when I tested it on HTC for example, no background image is displayed.
CSS
header {
background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/lets-get-down-to-business.jpg);
background-size: cover;
height: 100vh;
background-position: center;
}
and the only request that concerns BG image
@media only screen and (max-height:600px){
header {
height: 600px;
}
}
Any help would be appreciated with an explanation.
Thank!
+3
source to share
1 answer
I would guess this is because whatever browser you use on HTC does not support the Linear Gradient CSS feature.
Gradient Compatibility - Mobile
It seems to me that the Android browser does not support this.
That's what I would start, but you could just change the syntax a bit and make it work.
+1
source to share