I have created a separate asset source to upload my css on Amazon S3 cloud service. Initially, it was not allowing me to upload the files to S3. After adding CSS in the extraAllowedFileExtensions
in the config>general.php
file, I was able to upload the CSS file.
Here is the code in the template to load the css
<head>
{% for cssfile in craft.assets.source('css') %}
<link rel="stylesheet" type="text/css" href="{{ cssfile.url }}" />
{% endfor %}
I can see the link tags for each CSS file in the HTML source code, the URL is functional. However, browser refuses to render those files. If I go into chrome console>sources
, I can see all the CSS files listed there but they are empty!
When I create a new css asset source locally on the server, everything works (without changing anything inside the template)
I am really confused. I have never ever encountered a problem where browser refuses to read the css file.
Other assets such as js, images etc are loading properly from amazon S3. The only issue seems to be with css
Any ideas?