Мои коды css не работают в некоторых частях моего проекта django

Я создаю сайт на django, но мой код css работает в некоторых частях, а в некоторых нет. вот мой home.html

{% extends 'base.html' %}

{% load static %}

<html>

<head>
    <link rel="stylesheet" type="text/css" href="{% static '/static/css/home.css'%}">
    <script src="{% static 'fontawesomefree/js/all.min.js' %}"></script>
    <link href="{% static 'fontawesomefree/css/all.min.css' %}" rel="stylesheet" type="text/css">
</head>

<body>
    {% block content %}
    <div class="container">
        <div class="card">
            {% for product in product_list %}
            <div class="image">
                <img src="{{ product.image }}" alt="{{product.title}}">
            </div>
            <div class="content">
                <div class="product-name">
                    <h3>{{product.title}}</h3>
                </div>
                <div class="price-rating">
                    <h2>13.40$</h2>
                </div>
                <div class="rating">
                    <i class="fa-regular fa-star"></i>
                    <i class="fa-regular fa-star"></i>
                    <i class="fa-regular fa-star"></i>
                    <i class="fa-regular fa-star"></i>
                    <i class="fa-regular fa-star"></i>
                </div>
            </div>
            {% endfor %}
        </div>
    </div>

    {% endblock %}

</body>

</html>

и это home.css

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    display: flex;
    justify-content: center;
    align-content: center;
    min-height: 100vh;
    background: #dcdcdc;
}

.image {
    width: 10%;
}
.container {
    position: relative;
    width: 1200px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr))
}

Я могу изменить цвет страницы, но не могу изменить отображение или последовательность элементов. Изображение моего сайта У вас есть идеи, как решить эту проблему? И мои коды не конфликтуют, потому что я удалил все другие компоненты, кроме navbar, спасибо за ваше время.

У меня тоже иногда возникала такая проблема. Попробуйте аннулировать кэш вашего браузера, иногда css не обновляется при его изменении.

на вашей странице откройте devtool (обычно ctrl+c), затем перейдите на вкладку network и отметьте "disable cache", затем обновите страницу, пока открыт devtool devtool

Это обычно происходит из-за кэширования джанго, чтобы страницы загружались быстрее...

IMAGE. Я сделал так, как вы сказали в Ali fareeq, и я увидел, что home.html находится в какой-то странной ситуации, потому что вся страница идет с тегом "/", но home.html и home css не идут сами по себе, поэтому я думаю сделать base.html в home.html, если я не смогу получить решение до сегодняшнего дня.

Вернуться на верх