@alexxxey_code

Делаю меню (burger button). Почему вместо трех полосок две?

Как у меня :5fdcbbe0cdfb2684927072.png
И как должно быть:
5fdcbc2ce8343187089234.png
<header class="header">
	<div class="container">
		<div class="header__inner">
			<div class="header__logo">
				<img src="images/activebox-logo.png" alt="">
			</div>
				<nav class="nav">
					<a class="nav__link" href="#">FEATURES</a>
					<a class="nav__link" href="#">WORKS</a>
					<a class="nav__link" href="#">OUR TEAM</a>
					<a class="nav__link" href="#">TESTIMONIALS</a>
					<a class="nav__link" href="#">DOWNLOAD</a>
		    	</nav>
		    	<button class="burger" type="button">
		    		<span class="burger__item">Menu</span>
		    	</button>
		</div>
	</div>	
</header>

СSS:
.burger{
	display: none;
	background: none;
	border: 0;
	padding: 9px 2px;
	cursor: pointer;
}

.burger__item{
	display: block;
	width: 28px;
	height: 3px;

	background-color: #fff;

	font-size: 0;
	color: transparent;

	position: relative;

}
.burger__item:before,
.bureger__item:after{
	content: "";
	height: 100%;

	background-color: #fff;

	position: absolute;
	right: 0;
	z-index: 1;
}

.burger__item:before{
	width: 30px;
	top: -8px;
}

.burger__item:after{
	width: 26px;
	bottom: -8px;
}
  • Вопрос задан
  • 68 просмотров
Решения вопроса 1
@vladchv
WordPress Developer
очепятка:

.burger__item:before,
.bureger__item:after{
...
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы