Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flask style.css not loading from static/css/style.css

Here is the directory structure of my python/flask application.

application
templates/
static/css/style.css
static/js/appjs.js

In my "head" i have added this.

<link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet" />

JS file working fine but style.css is not working. But style.css is accessible through the url and also available in page source view

http://localhost:5000/static/css/style.css
like image 483
imdrupal Avatar asked Feb 13 '17 12:02

imdrupal


People also ask

Why is CSS not showing in Flask?

CSS stylesheets are considered static files. There is no interaction with their code, like there is with HTML templates. Therefore, flask has reserved a separate folder where you should put static files such as CSS, Javascript, images or other files. That folder should be created by you and should be named static.

How do I load a static file into a Flask?

To reference the static files using the url_for() function, pass in the name of the directory – static in this case – and the keyword argument of filename= followed by your static file name. Flask automatically creates a static view that serves static files from a folder named static in your application's directory.

How do I link a CSS file to a Flask?

To add template files like HTML, CSS, JavaScript in Flask application, you need to maintain a certain folder structure like below: Crate a folder for HTML files inside your root directory. I am giving name of that folder as “ templateFiles “ Create a folder for static files like CSS, images etc.


1 Answers

Had the same mistake and solved it in a very funny way after I had read your posts. I started my app and started researching by right-clicking on my Flask website from my browser. After a few seconds, inexplicably, the CSS picked up.(Cache?!?!)

I hope this helps

like image 193
Kofi Nice Avatar answered Oct 30 '22 08:10

Kofi Nice