JSFiddle - React, Tailwind, and code Playground

by acid test

HTML

<!DOCTYPE html>
<html lang="ru">

    <head>
        <meta charset="utf-8">
        <title>Photo Cage app</title>
        <link rel="stylesheet" href="normalize.css" type="text/css">
        <link rel="stylesheet" href="style.css">
    </head>

    <body>
        <header class="main-header">
            <div class="logo-image"></div>
            <ul class="main-menu">
			<li class="homepage">Home
                <li class="gallerypage activ">Gallery
                <li class="memberspage">Members
                <li class="logoutpage">Logout
            </ul>
        </header>
        <div class="main-content"></div>
        <footer class="main-footer">
        </footer>
    </body>

</html>

CSS

html,
body {
    margin: 0;
    padding: 0;
    font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
}

.main-header {
    margin: 0 auto;
    width: 1000px;
    height: 80px;
    display: flex;
    justify-content: space-between;
    background: #efefef url(./img/layer2.png) no-repeat;
    background-size: cover;
}

.logo-image {
    width: 200px;
    min-height: 70px;
    margin-top: 25px;
    margin-left: 120px;
    background: url(./img/logo-image.png) no-repeat;
    background-size: 100%;
}

.main-menu {
    margin: 0;
    list-style: none;
    margin-right: 100px;
    white-space: nowrap;
    line-height: 110px;
}

.main-menu li {
    width: 50px;
    height: 75px;
    display: inline-block;
    padding-left: 25px;
    padding-right: 28px;
    border-right: 2px solid #d5d5d5;
}

.homepage {
    width: 50px;
    background: url(./img/home.png);
    background-repeat: no-repeat;
    background-position: 38px 16px;
}

.gallerypage {
    width: 50px;
    background: url(./img/foto.png);
    background-repeat: no-repeat;
    background-position: 38px 16px;
}

.memberspage {
    width: 50px;
    background: url(./img/insan.png);
    background-repeat: no-repeat;
    background-position: 42px 16px;
}

.logoutpage {
    width: 50px;
    background: url(./img/logout.png);
    background-repeat: no-repeat;
    background-position: 42px 16px;
}

.activ {
    background: #e1dddd url(./img/foto.png);
    background-repeat: no-repeat;
    background-position: 40px 16px;
    border-bottom: 5px solid #ff7d00;
}

.main-content {}

.main-footer {}