Как сделать отступ между картинкой и текстом?

Question

Текст не сместился вправо, а просто остался под картинкой:

Я хотел бы в классе header_inner между картинкой и текстом сделать отступ, но justify-content: space-between; не работает. Вот написанный html код:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf=8">
        <link href="https://fonts.googleapis.com/css2? family=Lato:ital,wght@0,300;0,700;0,900;1,300&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="webpaint.css">
        <title>We are Webpaint</title>
    </head> 
    <body>
        <header class="header">
            <div class="container">
                <div class="header__inner">

                    <div class="header__logo">
                        <div class="im1"><img src="images/Logo.png" alt="Logo"></div>
                    </div>
                

                    <nav class="nav">
                        <a class="nav__link" href="#">HOME</a>
                        <a class="nav__link" href="#">PORTFOLIO</a>
                        <a class="nav__link" href="#">ABOUT</a>
                        <a class="nav__link" href="#">BLOG</a>
                        <a class="nav__link" href="#">CONTACT</a>
                    </nav>
                
                </div>
            </div>
        </header>
    </body>
</html>

Часть кода CSS:
    .header__inner{
        width:100%;
        display: flex;
        justify-content: space-between;
    }

Answer 1

justify-content: space-between;

Должно работать, но у Вас даже flex не применился. Проверьте путь к файлу стилей. Возможно Вам стоит добавить еще type:

<link rel="stylesheet" type="text/css" href="webpaint.css">

А вообще, css файлы обычно лежат в папке css, поэтому:

<link rel="stylesheet" type="text/css" href="css/webpaint.css">

Проверить подключен ли стиль можно в chrome нажав f12, и посмотреть нет ли ошибок. А во вкладке source должен быть Ваш файл стилей. Например, у меня это

<link rel="stylesheet" type="text/css" href="css/style.min.css">

и вот он на скрине подключен

А еще если в VS code Зажать ctrl и нажать на путь к файлу, то Вас должно перебросить в сам файл. Если этого не происходит, Вы неправильно его подключили.

Ну и последнее: Сохраните все файлы, а затем обновите страницу с Вашим сайтом, тогда стили должны примениться, если файл css подключен.

БЛОГ НА HUSL

Как сделать отступ между картинкой и текстом?

Ответы (1 шт):