<div class="main__header">
<div class="main__logo">
<img class="main__icon" src="img/top-logo.png" alt="" />
<div class="main__name">
Dart
<p>service manager</p>
</div>
</div>
<nav class="main__menu">
<ul class="menu__items">
<li class="menu__link"><a href="#"> Home </a></li>
<li class="menu__link"><a href="#"> Service </a></li>
<li class="menu__link"><a href="#"> Extension </a></li>
<li class="menu__link"><a href="#"> Pricing </a></li>
<li class="menu__link"><a href="#"> Help </a></li>
</ul>
</nav>
<button class="main__sing-up">sign up</button>
.main__header{
display: flex;
justify-content: space-between;
padding: 0 0 80px 0;
}
.main__logo{
display: flex;
}
.main__icon{
max-height: 20px;
}
p{
margin: 0;
}
.main__name{
color: white;
font-family: var(--extra-bold);
margin: 0 0 0 15px ;
}
li{
list-style-type: none;
}
.menu__items{
display: flex;
}
.menu__link{
margin: 0 20px 0 0;
font-family: var(--top-family);
}
.menu__link a{
color: white;
}
.menu__link a:hover{
color: black;
}
.main__sing-up{
padding: 6px 20px;
background-color: transparent;
color: white;
border-radius: 10%;
border: 1px solid white;
}
кнопка расширяется на всю высоты блока из за текста, как убрать у кнопки и вообще любого блока так делать?
Средний
