Тень Webkit-box не может быть удалена из одного пункта меню - PullRequest
0 голосов
/ 23 мая 2019

Я попытался удалить существующий CSS из одного из пунктов

следующий мой код

    <div class="main-navigation-inner">
            <div class="menu">
<ul
    <li id="menu-item-1406" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1406"><a href="#">Item one</a></li>

    <li id="menu-item-1553" class="nav_number menu-item menu-item-type-custom menu-item-object-custom menu-item-1553"><a title="Phone us today">121212</a></li>
    </ul></div> 

И Css за этим выглядит так

.main-navigation .menu > ul > li > a:hover, .main-navigation .menu > ul > li.active-menu-item > a {
    -webkit-box-shadow: 0 2px;
    box-shadow: 0 2px;
}

И CSS, который я добавил для удаления эффекта из последнего пункта меню, выглядит следующим образом

TRY 1

  #site-navigation .main-navigation-inner .menu #menu-item-1553{
    -webkit-box-shadow: none !important;
        -moz-box-shadow: none !important;
        box-shadow: none !important;

    }

TRY 2 - i have tried this to check if there will be any effect on the properties and values but nothing has changed

    .main-navigation .menu > ul > li > a:hover,
            .main-navigation .menu > ul > li.active-menu-item > a {
                -webkit-box-shadow: 0 0 !important;
                        box-shadow: 0 0 !important;
                        -moz-box-shadow:0 0 !important;
            }

1 Ответ

1 голос
/ 23 мая 2019

Ваша специфика CSS слишком высока, и я не понимаю, зачем это нужно. Попробуйте упростить ваш код, если это возможно.

Чтобы ответить на ваш вопрос, вы изначально применили тень блока для привязки, а затем пытались удалить тень блока из LI вместо привязки. Следующий код должен работать:

#menu-item-1553 a:hover {
-webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;

}

Над кодом должно работать.

...