Пытаюсь сделать домашнее задание по макету и не могу сделать main-menu
по центру, а architec-logo
в виде <a><a/>
слева, как показано тут.
*,
*::after,
*::before {
box-sizing: border-box;
}
body {
font-family: sans-serif;
font-weight: bold;
font-size: 22px;
line-height: 30px;
}
a {
text-decoration: none;
}
.main-header {
background-color: #313131;
display: flex;
}
.architect-logo {
justify-content: flex-start;
}
.logo {
color: white;
font-size: 22px;
text-transform: uppercase;
}
.main-menu {
display: flex;
justify-content: center;
list-style: none;
text-transform: uppercase;
color: #ffffff;
}
.main-menu-item {
font-size: 15px;
line-height: 20px;
}
.header-main {
height: 337px;
width: 1263px;
background-image: url(/images/header-bg.jpeg);
}
<header class="main-header">
<div class="architec-logo">
<a href="#" class="logo">Arcitec</a>
</div>
<nav class="main-manu">
<ul class="main-menu">
<li class="main-menu-item">Home</li>
<li class="main-menu-item">Architecture design</li>
<li class="main-menu-item">Strange buildings</li>
<li class="main-menu-item">Magszine</li>
<li class="main-menu-item">Blog</li>
<li class="main-menu-item">News</li>
</ul>
</nav>
</header>