In Rails / bootstrap, why isn't the background image stretching properly?

Question

I am using bootstrap and rails. I am trying to have a background image take up the entire background and stretch when the browser is larger. This is working for the most part, except when the browser is smaller the bottom of the image goes up and the bottom of the browser screen is blank. Here is the css I have now:

body { 
  background-image: url('bilde.jpg');
  background-repeat: no-repeat;
  background-position: fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

I have tried this:

body {
  background-image: url('bilde.jpg') no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

but it does not work either. Does anyone have an answer for this problem? Thanks.

Answer 1

I figured it out. The difference was that I should have been using

background: url('bilde.jpg') no-repeat center center fixed;

instead of

background-image: url('bilde.jpg') no-repeat center center fixed;

Pretty subtle but the change did the trick.