make background-image: url(); work in laravel

more informations pal....

background images are relative to the css file. Ordinarily you would just specify the path like url('/images/fluffybunnyrabbits.png');

Not really a laravel question. Suggest the excellent site http://www.w3schools.com/cssref/pr_background-image.asp to learn css

@Snapey - Well can you make it a dynamic path, this doesn't work on my production site, but this could be because I have to include the root in my path to get what you suggest to work in development site

background-image: url("/storybox1.0/public/img/BCsatBlack.png");

Then you have your server configured incorrectly. your site name and public should not be visible. The web server root (/) needs to be the contents of the public folder.

What if you have the image stored in S3?

From blade you would use: <img src="{{ Storage::disk(env( 'DISK', 'local'))->url('whatever.png') }}">

... defining DISK and local in you env. But how do you do that in a css?

You have to compile your CSS using a tool like LESS or SASS with Gulp. That would allow you to put the path to storage in a variable, same as you do with PHP.

@jhc333 beg to differ. You cannot run PHP code in your LESS or SASS files.

@Alaa15 you can still make use of your relative path in your css, place your css and images that are being used inside the public folder and then use your relative path.

@Snapey - plenty of ways to address the relative VS absolute issue with compilers.

Here's an example with gulp

https://www.npmjs.com/package/gulp-css-resolve-relative-urls

You can use inline CSS in a laravel blade as below:

style="background-image: url('{{ asset('assets/images/b2b/graph-01.svg')}}');"