Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

aleary06's avatar

404 error for .css files

I'm having an issue with a site I'm working on where .css throw a 404 error and it's been giving me problems for over a day now. I recently setup a Laravel 5 site hosted locally on my machine with IIS10. I have a master layout stored in /views/layouts (layout.blade.php) where I include the stylesheets like this:

    <head>
        ...

        <link href="{{URL::asset('css/bootstrap.min.css')}}" rel="stylesheet" />
        <link href="{{URL::asset('css/font-awesome.min.css')}}" rel="stylesheet" />
        <link href="{{URL::asset('css/prettyPhoto.css')}}" rel="stylesheet" />
        <link href="{{URL::asset('css/price-range.css')}}" rel="stylesheet" />
        <link href="{{URL::asset('css/animate.css')}}" rel="stylesheet" />
        <link href="{{URL::asset('css/main.css')}}" rel="stylesheet" />
        <link href="{{URL::asset('css/responsive.css')}}" rel="stylesheet" />
        
         ...
    </head>

Now, if I open the browser and navigate to http://localhost/test_site/public/ all of my views appear sans any styling. Opening up the developer tools there are seven errors stating:

    HTTP404: NOT FOUND - The server has not found anything matching the requested URI. (XHR): GET - http://localhost/test_site/public/css/<filename>.css

I'm confused as to why if the path being shown to the css file is correct, then why wouldn't it render as you'd expect it to. My initial thought was that there was an issue with my web.config file, which I have as:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <staticContent>
            <remove fileExtension=".css" />
            <mimeMap fileExtension=".css" mimeType="text/css" />
           
            <remove fileExtension=".js" />
            <mimeMap fileExtension=".js" mimeType="application/javascript" />
           
            <remove fileExtension=".jpg" />
            <mimeMap fileExtension=".jpg" mimeType="image/jpeg" />
           
            <remove fileExtension=".png" />
            <mimeMap fileExtension=".png" mimeType="image/png" />
        </staticContent>
        <rewrite>
            <rules>
                <rule name="Rewrite rule1 for laravel_rewrite">
                <match url=".*" />
                <conditions>
                     <add input="{laravel_rewrite:{HTTP_HOST}}" pattern="(.+)" />
                </conditions>
                <action type="Rewrite" url="{C:1}{REQUEST_URI}" appendQueryString="false" />
            </rule>
            <rule name="Rule 2" stopProcessing="true">
                <match url="^" ignoreCase="false" />
                <conditions>
                    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" ignoreCase="false" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" ignoreCase="false" negate="true" />
                </conditions>
                <action type="Rewrite" url="/Tutorial/public/" />
            </rule>
            <rule name="Rewrite routed access to assets(img, css, files, js, favicon)" stopProcessing="true">
                <match url="^(img|css|files|js|favicon.ico)(.*)$" />
                <action type="Rewrite" url="/Tutorial/public/{R:1}{R:2}" appendQueryString="false" />
            </rule>
        </rules>
        <rewriteMaps>
            <rewriteMap name="laravel_rewrite">
                <add key="localhost" value="/Tutorial/public" />
            </rewriteMap>
        </rewriteMaps>
    </rewrite>
</system.webServer>
</configuration>

I had originally generated the web.config file (which is stored in the public folder) using the URL Rewrite module in IIS, but the additions between <staticContent>...</staticContent> and the third rule I made as attempts to fix this issue.

I also thought the issue might be with the handler mappings, specifically the StaticFile one which uses the * wildcard as the RequestPath. I left that one in place but I also defined separate handlers with *.css and *.js which did not help.

Does anyone have any suggestions as to other things I could try? Just to clarify, here's some additional information about my setup:

  • The Windows feature Static Content has been enabled (I also disabled and re-enabled it as some other sites suggested).
  • The IUSR has the appropriate permissions to access all of the site's folders.

Thanks in advance to anyone who can help!

0 likes
6 replies
bobbybouwmann's avatar

So you have your assets in the public directory?

Also you can use the helper function for assets

<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}" />
aleary06's avatar

Hi bobbybouwmann. Thanks for responding! To answer your first question, yes, the structure of my public directory looks like this:

  • public/css/
  • public/fonts/
  • public/images/
  • public/js/
  • public/index.php
  • public/robots.txt
  • public/web.config

To your second point, I'm not sure what you're suggesting. I have used the asset helper function to define file locations. Would you mind clarifying? Thanks

bobbybouwmann's avatar

My example and your example are the exact same things ;)

<link href="{{ URL::asset('css/bootstrap.min.css') }}" rel="stylesheet" />

// Is the same as this        
<link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet" />

It's a helper function provided by Laravel ;)

Now for your problem. I have not much experience with IIS, so I'm afraid I can't help you further here! Goodluck!

1 like
Snapey's avatar

a lot of strange things happen if you don't have your public directory as the document root. it's one of the most frequent of the issues posted.

You will find life much easier if you fix this. Then you will have the ability to just say that your CSS is in /CSS

aleary06's avatar
aleary06
OP
10 years ago
Best Answer
Level 1

Hi Snapey thanks for the input. In my web.config, I changed the first rule to this:

<rule name="Rule 1" stopProcessing="true">
    <match url="^(.*)/$" ignoreCase="false" />
    <conditions>
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" ignoreCase="false" negate="true" />
    </conditions>
    <action type="Redirect" redirectType="Permanent" url="public/{R:1}" />
</rule>

Now everything's working perfectly.

Please or to participate in this conversation.