# Bar

index.html

<html>

<head>
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <div class="headerBar">
        <div class="barLeft">
            <p>
                Hi</p>
        </div>
        <div class="barRight">
            <a href="#">link</a>
            <a href="#">link</a>
            <a href="#">link</a>
        </div>
    </div>
</body>

</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

style.css

.headerBar {
    background-color: #263238;
    display: flex;
    padding: 2rem;
    justify-content: space-between;
    align-items: center;
}

.barLeft {
    color: whitesmoke;
}

.barRight {}

a {
    color: whitesmoke;
    text-decoration: none;
    padding: 1rem;
    margin: 1rem;
    border: 1px solid whitesmoke;
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20