Div background image not showing in heroku. However, the logo shows

rubyonrails-talk
1

I tried changing the image tag, no luck with that. I reviewed other post here and tried those solutions none work. I also use amazon cloudfront.

<div id="signup" class="container-fluid"> </div>

signup{ text-align: center; background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.4)), url("zoom1028.jpg"); }

2

I tried changing the image tag, no luck with that. I reviewed other post

here and tried those solutions none work. I also use amazon cloudfront.

Assuming your image is in app/assets/images, read up on the asset pipeline - the url for your image isn’t zoom1028.jpg in production, as rails will be adding a fingerprint to the filename. If you don’t want to deal with the asset pipeline you can also add it to public/. In the first instances I would get everything working without bringing cloudfron into the mix.

Fred

3

according to your code sample the image would have to be in the same directory of the page.

  • home dir
4

posted too soon If zoom1028.jpg is in the images folder then you need

url(“/images/zoom1028.jpg”);

the leading slash mean root of the site

or even for absolute URL

url(“https://c1.staticflickr.com/3/2807/12125940804_ebdbda0bc9_b.jpg”);

5

Found solution everything is working now. I discovered Cloudfront did not play a role in the error in this matter. When I disabled and enabled it there was no change affect on the problem. How, it worked perfectly once is used the solution below fix the issue.

The image was pointing to path.I used sass Image specific helper: background-image:image-url("photo.jpg") and it worked. According to sass instructions here GitHub - rails/sass-rails: Ruby on Rails stylesheet engine for Sass.