Laravel 5 not finding css files

Question

I've just installed a Laravel 5 project on MAMP and my pages are not finding the css files.

This is the link to my css in my app.blade.php file:

<link href="/css/app.css" rel="stylesheet">

And my .htaccess file has this line:

RewriteBase /laravel-site/laravel-5-app/public/

In the config folder my app.php file contains this:

'url' => 'http://localhost:8888/laravel-site/laravel-5-app/public/',

But when I open up this page: http://localhost:8888/laravel-site/laravel-5-app/public/auth/login and check the developer tools, it is looking for the css file at this location: http://localhost:8888/css/app.css

Just as a side note, if I go to this url: http://localhost:8888/laravel-site/laravel-5-app/public/ I get the correct welcome page.

Answer 1

Use this to add assets like css, javascript, images.. into blade file.

FOR CSS,

<link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" >

OR

<link href="{{ URL::asset('css/app.css') }}" rel="stylesheet" type="text/css" >

FOR JS,

<script type="text/javascript" src="{{ asset('js/custom.js') }}"></script>

OR

 <script type="text/javascript" src="{{ URL::asset('js/custom.js') }}"></script>

FOR IMAGES,

{{ asset('img/photo.jpg'); }}

Here is the DOC

Alternatively, if you pulled the composer package illuminate/html which was come as default in laravel 4.2 then you can use like below, In laravel 5. you have to manually pull the package.

{{ HTML::style('css/style.css') }}

Here is an Example.

Answer 2

In the root path create a .htaccess file with

<IfModule mod_rewrite.c>
Options +FollowSymLinks
RewriteEngine On

RewriteCond %{REQUEST_URI} !^/public/ 

RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f



RewriteRule ^(.*)$ /public/$1 
#RewriteRule ^ index.php [L]
RewriteRule ^(/)?$ public/index.php [L] 
</IfModule>

In public directory create a .htaccess file

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Handle Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

if you have done any changes in public/index.php file correct them with the right path then your site will be live.

what will solve with this?

• Hosting issue of laravel project.
• Css not work on laravel.
• Laravel site not work.
• laravel site load with domain/public/index.php
• laravel project does not redirect correctly

Answer 3

You can use one of the following options:

<link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" >

---

<link href="{{ URL::asset('css/app.css') }}" rel="stylesheet" type="text/css" >

---

{!! Html::style( asset('css/app.css')) !!}

Answer 4

Stop artisan serve

and try using

php -S localhost:8000 -t public

Answer 5

It's works. For css:

<link href="css/app.css" rel="stylesheet">

Try to:

 <link href="public/css/app.css" rel="stylesheet">

Answer 6

Here is the solution

  {!! Html::style('css/select2.min.css') !!}
  {!! Html::script('js/select2.min.js') !!}

Answer 7

This works for me

If you migrated .htaccess file from public directory to project folder and altered server.php to index.php in project folder then this should works for you.

<link rel="stylesheet" href="{{ asset('public/css/app.css') }}" type="text/css">

Thanks

Answer 8

I was having the same problem, until just now.

Removing the / from before /css/app.css so that its css.app.css worked for me.

Answer 9

To fast apply simple regex.

search : href="(.+?)"
replace : href="{{ asset('$1') }}"

and

search : src="(.+?)"
replace : src="{{ asset('$1') }}"

Answer 10

I used:

"{{asset('css/custom.css')}}"
"{{asset('css/app.css') }}"

First one is my own file the second one came with laravel. I'm using version 5.

http://spanibox.com/css/app.css works but http://spanibox.com/css/custom.css does not. I find this very weird.

Answer 11

If you are using laravel 5 or 6:

1. Inside Public folder create .css, .js, images... folders

2. Then inside your blade file you can display an images using this code :

<link rel="stylesheet" href="/css/bootstrap.min.css">
<link src="/images/test.png">
<!-- / is important and dont write public folder-->

Answer 12

my opinion is that:

<link rel="stylesheet" href="{{ URL::to('/css/app.css') }}">

is the best method to route to your css files.

The URL::to() also works for js

Answer 13

Laravel version 6.0.2

I also had the same problem. I used

<link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" >
<link href="{{ asset('css/bootstrap.css') }}" rel="stylesheet">

And after moving the CSS folder from folder resource to folder public it works

Answer 14

This worked for me:
If it's a css file tap

<link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" >

If it's an image tap

<link href="{{ asset('css/img/logo.png') }}" rel="stylesheet" type="text/css" >

Answer 15

<link rel="stylesheet" href="/css/bootstrap.min.css">if you are using laravel 5 or 6 you should create folder css and call it with

it works for me

Answer 16

You can simply create assets in public and added more paths and call in your head html the following code

Answer 17

if you are on ubuntu u can try these commands:

sudo apt install npm

npm install && npm run dev

Answer 18

Simply you can put a back slash in front of your css link