How can I fix styles.css:1 Failed to load resource: the server responded with a status of 404?

Question

i am trying to learn django and my css file cant be linked with the html file idk why

This is the tree of the static folder:

├── images
├── js
├── plugins
└── styles
    └── styles.css

settings.py

STATIC_URL = '/static/'

STATICFILES_DIR = [
    os.path.join(BASE_DIR, 'static')
]

index.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
    <head>
        <meta charset="utf-8">
        <title>Register</title>
        {% load static %}
        <link rel="stylesheet" href="{% static './styles/styles.css' %}">
    </head>
    <!-- <script src="../data/script-clac.js" type="text/javascript"></script> -->
    <body class="body1">
        <div class="div1">
            <h2>Register</h2>
            <p class="text">Name</p>
            <input type="text" placeholder="Enter your name" id="name">
            <p class="text">Username</p>
            <input type="text" placeholder="Choose a username" id="username">
            <p class="text">Password</p>
            <input type="password" placeholder="Choose a password" id="password">
            <p id="result"></p>
            <input type="checkbox" onclick="myFunction()">Show Password

            <button id="btn">Calculate</button>
        </div>
    </body>
</html>

Error message:

styles.css:1 Failed to load resource: the server responded with a status of 404 (Not Found)

I have been trying to fix the problem since a long time, please help me.

Also, here is my project directory

Does this answer your question? [django html template can't find static css and js files](https://stackoverflow.com/questions/66437690/django-html-template-cant-find-static-css-and-js-files) — Ivan Starostin, Mar 22 '21 at 06:48

score 0 · Answer 1 · answered Mar 22 '21 at 06:28

0

Try to remove the ./ in this line

<link rel="stylesheet" href="{% static './styles/styles.css'%}">

Try this

<link rel="stylesheet" href="{% static 'styles/styles.css'%}">

answered Mar 22 '21 at 06:28

Khava

66
1
5

``` GET http://127.0.0.1:8000/static/styles/styles.css net::ERR_ABORTED 404 (Not Found) ``` Another error ``` ``` – A_HiddenDonut Mar 22 '21 at 07:24

score 0 · Answer 2 · answered Mar 22 '21 at 06:30

0

It's been a while since I've worked with Django, but to me the problem looks like it's in <link rel="stylesheet" href="{% static './styles/styles.css' %}">. This will create a path to the css file something like /static/./styles/styles.css, which is why the file can't be found (hence the 404).

What you want to link to is /static/styles/styles.css, so the ./ at the start should be removed.

answered Mar 22 '21 at 06:30

spakejaniel

13
2

``` GET http://127.0.0.1:8000/static/static/styles/styles.css net::ERR_ABORTED 404 (Not Found) ``` ``` ``` Another error – A_HiddenDonut Mar 22 '21 at 07:22
I assume the path isn't actually ```127.0.0.1:8000/static/static/styles/styles.css```. `````` - this line should be ``````. – spakejaniel Mar 22 '21 at 07:32
Is your BASE_DIR correctly pointing to the Registrations folder? – spakejaniel Mar 22 '21 at 07:41

Meet · Answer 3 · 2021-03-22T12:53:35.060

0

add STATICFILES_DIRS inside setting file

ex:

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static')
]

edited Mar 22 '21 at 12:53

answered Mar 22 '21 at 12:27

Meet

164
2
11

How can I fix styles.css:1 Failed to load resource: the server responded with a status of 404?

3 Answers3