Background image does not render in firefox

Question

I have a single webpage.

  <head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

<title> Welcome to domain.com!</title>
<link href="css/styles.css" type="text/css" rel="stylesheet" />
</head>
<body>
</body>

And a css file

body {
    background-image: url("../pics/city7.png");
    background-size: 100% 100%;
    display: inline-block;  }

It works perfectly (scaling) in chrome. But in firefox it is just a bunch of lines. I tried using display: inline-block - but that does not fix the problem. I am not even sure what it is doing. From what I know (and it aint much at this point) is that if I put the image in HTML it will override the CSS - can someone points me in the right direction?

Answer 1

In your CSS file, you could write something like:

html {
  min-height: 100%;

}

body {
  background-image: url("../pics/city7.png");
  background-size: 100% 100%;
}

Background image does not render in firefox

Question

1 answers

solution1
1 ACCPTED 2015-09-10 21:07:59

Background image does not render in firefox

Question

1 answers

solution1 1 ACCPTED 2015-09-10 21:07:59

solution1
1 ACCPTED 2015-09-10 21:07:59