jeudi 26 janvier 2017

Parallax effct not working in Firefox

So first of all, I'm not a professional coder but I have some experience. So my problem is that the image in the background doesn't show in Firefox but it does in Chrome and I want it to work in both. Here is my code:

//No js yet
#welcome {
  font-family: 'Nunito', sans-serif;
  font-size: 80px;
  margin: 0px;
  color: #000;
  font-family: 'Slabo 27px', serif;
  background-color: #D5D5D5;
  height: 1000px;
  text-align: center;
  vertical-align: middle;
  line-height: 1000px;
  text-shadow: 0px 0px 10px grey;
  border-top: 1px solid black;
}

body {
  background-color: #000;
  font-family: 'Slabo 27px', serif;
  padding: 0px;
  margin: 0px;
}
#parallax {
          background-image: url("http://ift.tt/2jVqGBK");

    min-height: 100%; 
        margin: 0px;

    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
<html>
<head>
  <link rel="stylesheet" href="style.css"/>
  <link href="http://ift.tt/1OlMWLr" rel="stylesheet">
  <link href="http://ift.tt/1SsY67d" rel="stylesheet">
  <meta content="-1" http-equiv="expires"></meta>
  <meta content="text/html; charset=utf-8" http-equiv="content-type"></meta>
 </head>
<body>
<div id="parallax"></div>
<center><p align="center" id="welcome">Welcome To My Website!</p></center>
</body>
</html>

So if you copy all that and try it in chrome it works (for everyone I think), but it doesn't work in Firefox. HELP!




Aucun commentaire:

Enregistrer un commentaire