Adding a background image in Ruby on Rails 2 in CSS

Question

I generated a scaffold in ruby and I want to insert a background image to every page on the site but Im not sure what the link to the image should be.

my image is in app/assets/images/"dep.jpg"

this is what i have but it isnt working:

background-image:url('../images/dep.jpg');
}

Any help? thanks

try giving the exact path. Coz even the folder /public has images folder and I think its looking there instead of your path — uday
– uday, Commented Jan 26, 2012 at 19:48
It depends on where your file is, relative to your images directory. ../ says go one directory up from the current file location and look for an images directory. What does your directory structure look like? — Matt K
– Matt K, Commented Jan 26, 2012 at 19:49
my rails project folder is called ClassSchedule/apps/assets/images/dep.jpg — Dan
– Dan, Commented Jan 26, 2012 at 19:52
and where is the file containing this line: background-image:url('../images/dep.jpg'); — Matt K
– Matt K, Commented Jan 26, 2012 at 19:53
in my css file located at ClassSchedule/apps/assets/stylesheets/scaffold.css — Dan
– Dan, Commented Jan 26, 2012 at 20:05

Dylan Markow · Accepted Answer · 2012-01-26 20:11:56Z

77

In Rails 3.1, the path will actually be `/assets/dep.jpg':

background-image: url(/assets/dep.jpg);

If you convert your scaffold.css file to a Sass file (rename to scaffold.css.scss) then you can use the helper:

background-image: image-url("dep.jpg");

answered Jan 26, 2012 at 20:11

Dylan Markow

125k27 gold badges287 silver badges202 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

uday · Accepted Answer · 2012-07-24 19:03:27Z

19

The webserver in rails takes public folder as the base of the application. Hence its looking for the specific image under /public/images/ instead of app/assets/images/"dep.jpg" & since its not there over there you cannot get the image. Try to put your image in /public/images/ folder then it would work.

Edit: If you are using rails 3.1 then this would be different as Rails 3.1 uses the concept of asset pipeline for the assets of your application so then then path app/assets/images/dep.jpg would obviously work.

edited Jul 24, 2012 at 19:03

answered Jan 26, 2012 at 19:54

uday

8,7704 gold badges33 silver badges55 bronze badges

6 Comments

Dan Over a year ago

im kind of new to rails so im not sure where the public folder is. im just running this on localhost using rails server

uday Over a year ago

public folder is present in root folder of your rails application. The hierarchical structure goes like <yourrailsappname>/public/images

Dan Over a year ago

my public folder doesnt have an images folder, should I make one or should I just put it in the public folder?

uday Over a year ago

make a folder images & put it there so that you can have all your image-type files at a place.

uday Over a year ago

it has to do with CSS. you have to set an attribute to no-repeat like that. & Please dont forget to rate my answer if it helped.

|

user1187135 · Accepted Answer · 2012-10-10 05:30:23Z

11

If your image is in app/assets/images/dep.jpg, then in the css file in rails you should write background: url('/assets/dep.jpg');

You don't have to put the image in the public folder this way.

answered Oct 10, 2012 at 5:30

user1187135

Comments

laffan · Accepted Answer · 2015-04-23 21:37:58Z

2

background: url('/assets/image_name.jpg');

This worked for me in Rails 4.0

edited Apr 23, 2015 at 21:37

answered Apr 8, 2015 at 14:18

laffan

3193 silver badges8 bronze badges

2 Comments

laffan Over a year ago

Sound, its my first day

Abhinay Over a year ago

Cool!! Rails way it is :)

Oleksandr Skrypnyk · Accepted Answer · 2012-01-26 19:55:43Z

1

You can use absolute path for sure:

background-image:url('/images/dep.jpg');

answered Jan 26, 2012 at 19:55

Oleksandr Skrypnyk

2,8301 gold badge23 silver badges26 bronze badges

1 Comment

uday Over a year ago

I was wondering since Rails takes public as the basefolder, dont you think even if he does apply the absoulte path it wont work unless & until the file is reachead by the webserver by some strange tweak?

Wylliam Judd · Accepted Answer · 2017-01-26 22:22:51Z

0

If you are using a modern version of rails (3.1 or later I believe), you can use:

background: url('../dep.jpg');

Since the css also lives in your assets folder .. automatically refers to the assets folder.

answered Jan 26, 2017 at 22:22

Wylliam Judd

11.2k3 gold badges31 silver badges36 bronze badges

Collectives™ on Stack Overflow

Adding a background image in Ruby on Rails 2 in CSS

6 Answers 6

Comments

6 Comments

Comments

2 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

6 Comments

Comments

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related