0

Есть шаблон введите сюда описание изображения

На нем Company name в шапке стоит слева, а все остальные ссылки справа.

Как сделать так же как в шаблоне, потому что у меня получается так: введите сюда описание изображения

itProger - Company name. Я подключил статику вот так:

{% load static %}
    <link rel="stylesheet" type="text/css" href="{% static 'polls/main.css' %}" />

Сам css файл :

.header{
    justify-content: space-between;
    align-items: center;
}


.header__inner{
    display: flex;
    justify-content: space-between;
    align-items: center;

}



.header__inner a{
    margin: 0px 10px;
}

весь html:

{% load static %}
<!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 'polls/main.css' %}" />
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <title>{% block title %}{% endblock %}</title>


</head>

<body>
    <header class="d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-body border-bottom shadow-sm">
        <p class="h5 my-0 me-md-auto fw-normal">itProger</p>
        <nav class="my-2 my-md-0 me-md-3">
            <a class="p-2 text-dark" href="/">Главная</a>
            <a class="p-2 text-dark" href="about-us">Про нас</a>
        </nav>
    </header>
    {% block content %}{% endblock %}
</body>

</html>

Подскажите пожалуйста, в чем ошибка..

3
  • html-код покажите-то
    – andreymal
    21 фев 2021 в 20:02
  • добавил код, посмотрите..
    – yOz
    21 фев 2021 в 20:56
  • Что-то у вас css-код не очень соответствует html-коду...
    – andreymal
    21 фев 2021 в 21:13

1 ответ 1

0

Вот так:

header {
    display: flex;
    justify-content: space-between;
}

Этот введите сюда описание изображения

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.