- Регистрация
- 22 Янв 2018
- Сообщения
- 190
- Лучшие ответы
- 0
- Репутация
- 1
Всем привет! Всё не могу сделать в одну строчку эти данные, помогите пожалуйста: :an:
CSS:
PHP:
<div id="navBar__menu">
<div class="main-menu">
<div class="logo">
<a href="#"><img src="templates/images/logo.png"></a>
</div>
<ul class="main-menu__ul">
<li class="main-menu__li">
<a href="news.html" class="main-menu__link">Новости</a>
</li>
<li class="main-menu__li">
<a href="news.html" class="main-menu__link">Форум</a>
</li>
<li class="main-menu__li">
<a href="news.html" class="main-menu__link">Донат</a>
</li>
<li class="main-menu__li">
<a href="news.html" class="main-menu__link">О проекте</a>
</li>
</ul>
<div class="login">
<a href="login.php" class="btn__login"><svg class="icon btn__icon" width="18" height="18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 17A8 8 0 1 0 9 1a8 8 0 0 0 0 16z" stroke="#FFFFFF" stroke-width="1.2" stroke-miterlimit="10"></path><path d="M8.975 11.258a2.92 2.92 0 1 0 0-5.84 2.92 2.92 0 0 0 0 5.84z" stroke="#FFFFFF" stroke-width="1.2" stroke-miterlimit="10"></path><path d="M4.191 15.405c0-2.65 2.135-4.172 4.786-4.172 2.65 0 4.785 1.522 4.785 4.172" stroke="#FFFFFF" stroke-width="1.2" stroke-miterlimit="10"></path></svg>Личный кабинет</a>
</div>
</div>
</div>
PHP:
.main-menu {
margin-top: 100px;
width: 100%;
position: relative;
z-index: 100;
display: block;
margin: 58px 0 52px;
height: 2px;
}
ul.main-menu__ul {
display: flex;
padding: 0;
justify-content: center;
}
li.main-menu__li {
padding: 18px;
}
.main-menu__link {
display: block;
text-decoration: none;
color: #333;
}
.login {
position: relative;
display: block;
padding: 6px 10px 0;
font-size: 14px;
line-height: 27px;
}
.btn__icon {
margin: 0 6px 0 0;
vertical-align: top;
}
.icon {
display: inline-block;
vertical-align: middle;
background-position: 0 0;
background-repeat: no-repeat;
-webkit-background-size: 100% auto;
-moz-background-size: 100% auto;
background-size: 100% auto;
position: relative;
}
.btn__login {
padding: .7em 1.5em;
color: #fff;
background: linear-gradient(90.09deg, #37ae80 -6.21%, #37ae80 -6.19%, #167450 137.03%);
border-radius: 20px;
transition: 0.2s all;
}
.btn__login:hover {
box-shadow: 0 5px 35px rgba(0, 0, 0, 0.22);
}