How to fix background not appearing (transition) on Safari

Question

My background image (that is covered in a gradient) does not appear on Safari (it works on Chrome).

body{
  background:linear-gradient(rgba(0, 0, 0, 0.95),rgb(0, 0, 0, 
  0.95)),url("https://www.w3schools.com/cssref/img_tree.gif") no-repeat center center fixed;
  background-size: cover;
  overflow: hidden;
  height: 100%;
}

<html>
<head></head>
<body></body>
</html>

This is my .css for the background. I have already tried modifying the linear gradient to -webkit-linear-gradient (as apparently webkit is a Safari friendly workaround...?)

I should, on Safari, be seeing a background image of a computer covered by a black fade (just to darken the image). Instead, Safari displays the background as pure white.

Hi, I just noticed you have missed "a" in "rgba" in your style sheet. — Prakash Rajotiya, Oct 07 '19 at 05:33
Hello Prakesh and Udhay, I have accounted for your suggestions and it now works. Thank you! — Jordan, Oct 07 '19 at 14:35

score 0 · Answer 1 · answered Oct 07 '19 at 14:36

0

-webkit-background-size: cover;

I also forgot to add an "a" to my rgba...

answered Oct 07 '19 at 14:36

Jordan

3
2

How to fix background not appearing (transition) on Safari

1 Answers1