Click here to Skip to main content
15,867,895 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
i'm new to laravel and trying to display background image but not working i searched a lot but nothing worked for me

in the public folder i have images folder and asset folder in asset folder i have the css folder

What I have tried:

CSS
background-image: url("/images/banner_img.png");


i found this
HTML
style="background-image:url({{url('/images/banner_img.png')}})"

but this only work in HTML, i need something work in css file

i tried also put public in the url
CSS
url("public/images/banner_img.png");
but not worked and when i click on the link it go to this url >>http://localhost/learning_academy/public/asset/css/public/images/banner_img.png

without public
CSS
url("/images/banner_img.png");
it go to this url >> http://localhost/images/banner_img.png

when i removed the / in
CSS
url("images/banner_img.png");

the url became like this>> http://localhost/learning_academy/public/asset/css/images/banner_img.png when i clicked on it so i don't know why this happens

and in all three the image not showing
Posted
Updated 1-Oct-20 14:34pm
v3

Let's talk about the last one:
url("images/banner_img.png");


That is relative to your CSS file.
You said that the link ended up being:
http://localhost/learning_academy/public/asset/css/images/banner_bg.png

That means your CSS file must be in /localhost/learning_academy/public/asset/css/ right?

To solve this problem we have to know the path to the CSS.

You can actually try the full path just to try it out.
Add the following to your CSS file:
background-image: url("http://localhost/learning_academy/public/asset/css/images/banner_bg.png")

But also you are referring to the image as two different names so a bit confusing:
1) banner_img.png
2) banner_bg.png
 
Share this answer
 
v2
Comments
Member 12214576 24-Sep-20 17:43pm    
it's the first one "banner_img.png" i will update it,
i added the url in the css file but nothing happens

this is the path of the css files >>
C:\xampp\htdocs\learning_academy\public\asset\css

and this is the path of images
C:\xampp\htdocs\learning_academy\public\images
it worked after i put the Images folder in the same path folder that have the CSS folder
 
Share this answer
 
Comments
Richard Deeming 2-Oct-20 4:44am    
As already more than adequately explained in solution 1.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900