I have a simple flask app:
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
return render_template('basic.html')
if __name__ == '__main__':
app.run(debug=True)
Directory structure(as recommended):---
\templates
\basic.html
\static
\basic.css
basic.py
And I have connected my CSS file in the HTML using:---
<link rel="stylesheet" href="{{ url_for('static', filename='basic.css') }}">
The problem: The changes I'm making to my CSS file aren't taking place in my app/website even after reloading the browser and when I checked the sources in developer tool it turns out that the styling isn't applied! This is my CSS file:--
h2{
font-size: 50px;
color: red;
background-color: green;
}
p{
color: blue;
}
h3{
font-size: 100px;
color: green;
background-color: red;
}
h4{
color: purple;
background-color: blue;
}
And this is what is shown in the developer tools:--
h1{
font-size: 50px;
color: red;
background: green;
}
p{
color: blue;
}
I looked at other answers too (Here) but I'm unable to understand what exactly am I doing wrong!
Edit: I'm not seeing the changes after navigating to the file in the browser too:--
Edit 2: Okay! The hard refresh way(Ctrl + shift + R) is working but I have to do it every time I make any change! Isn't there any other way?