<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/static/bootstrap.css">
<title>Document</title>
</head>
<body>
<div class="container">
<form method = "post" enctype="multipart/form-data">
<h2>Choose your State</h2>
{{form.state_variable}}
<h2>Choose your District</h2>
{{form.district_variable}}
<br>
<br>
<br>
<input type="submit" name="submit" value="submit"/>
</div>
</body>
</html>
I'm new to creating web apps through flask and html. I created a very simple page that takes input from the html file and displays a table in another html. My python flask and html both are running fine. I wanted to add some bootstrap.css, so tried adding the div class=container to the html page using visual studio code. I previewed it with the 'Live Server' in visual studio code and it works fine. However, when I start the local server to work with flask, at that time bootstrap css is not getting applied. What I see is a barebone html page without styles being applied. All functionalities works fine though. Any help will be much appreciated. Thanks.
Error Message: "GET /css/bootstrap.css HTTP/1.1" 404 -
Note: I'm not sure why the code is looking for "/css/" folder while I have clearly put my css file in the static folder and referenced it
You need to replace href="/static/bootstrap.css" and replace it with:
href="{{url_for('static', filename='bootstrap.css')}}"
You need to do that, because you write in flask like this. Normally you would do it like you did it. Feel free to tell me any errors
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With