Хочу сделать меню - гамбургер в мобильной версии. Но чтобы видно было только в мобильной версии. А в полноэкранном режиме обычное меню. У меня видно и в моб.версии и в полноэкранном режиме, display: none не работает. Что можно сделать?
Есть html код:
<div class="col-xl-auto">
<button class="top-nav_btn">
<i class="icon-menu"></i>
</button>
<ul class="top-nav_menu">
<li><a href="#">Главная</a></li>
<li><a href="#">О компании</a></li>
<li><a href="#">наши услуги</a></li>
<li><a href="#">Структура</a></li>
<li><a href="#">инвесторам</a></li>
<li><a href="#">контакты</a></li>
</ul>
</div>
Sass:
.top-nav
background-color: $white
padding: 15px
position: relative
&_btn
display: none
width: 30px
height: 30px
background-color: transparent
border: none
font-size: 18px
position: absolute
right: 15px
top: -50px
Вот media.sass:
@media (max-width: 480px)
.top-nav
&_btn
display: block
