Nginx not applying CSS file

csshtmlnginx

I'm using the dynamic module 'fancyindex' on Nginx and am attempting to load an external css file into these fancyindex 'ed pages. The following is the config file in my sites-available directory : 

location /images/ {
            alias /var/www/test/public/images/;
            fancyindex on;
            fancyindex_css_href /etc/nginx/css/test.css;

I get no errors with 'nginx -t' and the page loads correctly, however the css specifications are not applied, instead the default fancyindex look is still there. FancyIndex is doing what it's supposed to in terms of finding and coding the css file into the pages html. When I view the page source the following is included before the auto created listings : 

<link rel="stylesheet" href="/etc/nginx/css/test.css" type="text/css"/>

My 'test.css' file reads : 

a, a:active {text-decoration: none; color: #41b5f4;}
a:visited {color: #41b5f4;}
a:hover, a:focus {text-decoration: underline; color: #f4ee41;}
body{
background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;

I'm still relatively new to Nginx and html, so I wasn't sure where exactly the problem lied here, whether it was in the css file, the site config, or whichever. I've tried several different ways of writing out the css file and such, but have had no luck, so I thought I'd ask here. Also I have tried clearing my cache on Chrome.

Best Answer

As the documentation for fancyindex_css_href states:

The provided uri parameter will be inserted as-is in a <link> HTML tag.

This means that the URI you provide must be an absolute or relative URI. Since you've used a relative URI, the path you provide is relative to the document root. You should either correct the path, move the CSS file, or both.

Related Topic