Проблема в том, что я не понимаю как "Блог" разместить на одном уровне с остальными кнопками меню. Заранее прошу прощения за нубский вопрос.
html {
font-size: 10px;
}
body {
background-color: #f2f2f2;
font-family: 'Futura PT'; /* Гарнитура шрифта */
src: url(../fonts/Futura PT.ttf); /* Путь к файлу со шрифтом */
}
*{
padding: 0;
margin: 0;
}
ul{
display: flex;
}
a{
text-decoration: none;
}
header{
height: 53px;
background: #ffffff;
padding: 10px 200px;
}
.top-slide{
background: #ffffff;
}
.menu-container{
height: 57px;
width: 1366px;
margin: 0 auto;
display: flex;
justify-content: baseline;
}
.menu-container a{
color: #686868;
font-size: 16px;
margin-right: 20px;
padding: 24px 40px 14px 40px;
}
/*стилизация кнопок верхнего меню*/
.menu-container a:hover{
background: #eeeeee;
/*padding: 25px 30px;*/
height: 10px;
width: 90px;
}
#menu-checkbox{
display: none;
}
<main>
<section class="top-slide">
<div><h2>Блог</h2></div>
<div class="menu-container">
<input type="checkbox" id="menu-checkbox">
<nav rove="navigation">
<label for="menu-checkbox" class="toggle-button"
data-open="Menu" data-close="Close" onclick></label>
<ul class="main-menu">
<li><a href="#">Для бізнесу</a></li>
<li><a href="#">Для Юристів</a></li>
<li><a href="#">Підписатися на розсилку</a></li>
</ul>
</nav>
</div>
</section>
</main>