marcacyr marcacyr - 11 months ago 106
Sass (Sass) Question

Add background image to Rails app when using Bootstrap

I am working on a app using Bootstrap as the framework in Rails (bootstrap-sass). What I want to do is add a sweet background image but I can't seem to override the white background of the body no matter what I try.

Has anyone had success with this? What do I have to change or add to get this to happen?

In addition to trying other things, I have even tried wrapping all the contents in the body in a div with an id, then calling that class in the custom css.scss file where I have successfully customized other aspects of Bootstrap.

The code I added using the id:

html body #bgimage {
background-image: image-url('/images/cityscape.jpg');

I just checked the errors in the development local server and I have this: ActionController::RoutingError (No route matches [GET] "/assets/images/cityscape.jpg"):


Answer Source

There was a similar discusion recently, the problem was that background-image oddly does not work with bootstrap. Try:

html body #bgimage {
    background: url('cityscape.jpg');

Notice, that asset-pipeline does its work for finding the proper location of your file, so you don't have to mention the path.