Задать вопрос

Как правильно убрать черную обводку на фоне?

Доброго всем времени суток, вот такая вот проблема, нужно при ховере на элемент меню убрать рамку эту черную заливку элемента на фоне:

5d00c8bca1507350744640.jpeg

Посоветуйте, как лучше сделать?

html:
код

<div class="wrapper-icon">
        <div id="menu-icon" class="menu-nav-class"><span>&#9776;</span></div>
    </div>
    <nav class="nav-menu" id="menu-nav">

        <?php
        wp_nav_menu(array
        (
            'menu_class' => 'menu',
            'theme_location' => 'Головне меню',
            'container' => false
        ));
        ?>
    </nav>


CSS:
код

#menu-nav {
    width: 100%;
    height: 150px;

}

.wrapper-icon {
    display: none;
    width: 99%;
    height: 60px;
    overflow: hidden;
    color: #ffffff;
}

#menu-icon {
    display: none;
    width: 40px;
    height: 35px;
    margin: 10px 10px 0 0;
    color: #fff;
    cursor: pointer;
    background: #000;
    border: 1px solid #fff;
    text-align: center;
}

#menu-icon span {
    line-height: 35px;
    font-size: 30px;
}

.menu {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    padding-top: 30px;
}

.menu li {
    font-size: 27px;
    text-transform: uppercase;
    padding-top: 15px;
    opacity: 0.4;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
}
.menu li a {
    color: #abb3b7;
    outline: none;
    overflow: hidden;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    transition: 1s;

}

.menu li:hover {
    opacity: 1;
}

.menu li a:hover {
    color: #fff;
    box-shadow: 0 10px 50px;
}

  • Вопрос задан
  • 63 просмотра
Подписаться 1 Простой Комментировать
Пригласить эксперта
Ответы на вопрос 1
Ваш ответ на вопрос

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

Похожие вопросы