Помогите опустить содержимое SideBar'a

Question

Нужно сделать так, чтобы Линки были ниже шапки. Уже долго мучаюсь, помогите пожалйста!)

[![введите сюда описание изображения][1]][1]

  [1]: https://i.stack.imgur.com/KFZrS.png

<!DOCTYPE html>
<html lang="en">
    <head>

        <meta charset="UTF-8">
        <title> MySite </title>
        <link rel="stylesheet" href="css/style.css">

    </head>

    <body>

        <div id="header">

                <div class="logo"><img src="img/logo.png">



                </div>
            </div>

        <div id="main">     

            <!-- Контент -->

            </div>

        <div id="sidebar">              
                <ul>

                        <li><a href=""> Link 1 </a></li>
                        <li><a href=""> Link 2 </a></li>
                        <li><a href=""> Link 3 </a></li> 
                        <li><a href=""> Link 4 </a></li>
                        <li><a href=""> Link 5 </a></li>

                </ul>
            </div>

            </div>

        <div id="footer">



            </div>



        <script src="js/script.js"></script>
    </body>

</html>

body {
    margin: 0px;
    padding: 0px;
}

.logo {
    padding: 5px;
    margin: 5px;
}

#header {
    background: #151718;
    display: flex;
    justify-content: center;
}

#sidebar {
    margin-top: 5px;
    background: #151718;
    width: 200px;
    height: 100%;
    display: block;
    left: 0px;
    top: 0px;
    position: absolute;
}

ul {
    margin: 0px;
    padding: 0px;
}

ul li {
    list-style: none;
}

ul li a {
    background: #1C1E1F;
    color: #ccc;
    display: block;
    border-bottom: 1px solid black;
    width: 180px;
    padding: 10px;
    text-decoration: none;

}

Answer 1

варианты: 1) можно убрать top:0; 2) добавить отступ для сайдбара;

Также опустите main ниже сайдбара в коде

P.S. не используйте div'ы для шапки, футера, контента для этого есть специальные тэги. к примеру для шапки следует использовать тег header http://htmlbook.ru/html/header. Надеюсь вы умеете пользоваться DevTools и не надо про него объяснять

БЛОГ НА HUSL

Помогите опустить содержимое SideBar'a

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