Question

I’m writing a Rails application using Bootstrap. I want to set an image background for it, which I’ve done using an override.css.scss file. The background displays white when looking at my image, which is in the app/assets/images/ folder.

if I set the image to an external resource, it displays fine.

CSS in override with local image:

html, body {
    padding-top: 60px;
    background-image: url('app/assets/images/nyc.png');
    /* background-repeat: no-repeat; */
    background-color: transparent;
    height: 1000px;

}

CSS in override with external image:

html, body {
    padding-top: 60px;
    background-image: url('http://www.google.com/intl/en_com/images/srpr/logo3w.png');
    /* background-repeat: no-repeat; */
    background-color: transparent;
    height: 1000px; 
}

Baffling.

Answer 1

Relative URLs in CSS are relative to the to the CSS file, so perhaps you are pointing to the wrong location?

/path/to/app/assets/images/nyc.png
/path/to/style.css

Unless your CSS file lives here, relative to the file in question, you’ll be getting a 404 on that image.