html - ドロップダウンメニューのホバー時にテキストを白のままにする

Question

問題は、フォントを離れると<a>、フォントの色がホバー以外の色に戻ることです。

カーソルが「About」リンクを離れても、「About」テキストの色を白にしたい。

私はホバーリンクのテキストにすべてを載せようとしてきましたcolor:が、喜びはありません。

これが私のフィドルです

HTML

 <nav>
    <ul>
        <li class="n1">
            <a href="#">Home</a>
        </li> 
        <li class="n2">
            <a href="#">About</a>
            <ul class="menu">
                <li>
                    <a href="#">List 1</a>
                </li>
                <li>
                    <a href="#">List 2</a>
                </li>
                <li>
                    <a href="#">List 3</a>
                </li>
            </ul>
        </li> 
        <li class="n3">
            <a href="#">Contact</a>
        </li>        
    </ul>
</nav>​

CSS

nav {
    width 100%;
}

nav ul {
    list-type: none;
}

nav ul li {
    maring: 0;
    padding: 0;
}

nav ul li a {
    display: block;
    float: left;
    padding: 10px 20px;
    line-height: 1;
    color: dodgerblue;
    background: silver;
    text-decoration: none;
    text-transform: uppercase;
}

nav ul li a:hover {
    color: white;
}

nav ul li.n2:hover > .menu {
    display: block;
}

.menu {
    position: absolute;
    top: 36px;
    left: 86px;
    background: silver;
    width: 93px;
    display: none;
}

.menu li a {
    color: white;
}

.menu li a:hover {
    color: dimgray;
}
​

Answer 1

liにホバーを追加する必要があります

nav ul li:hover a {
    color:white;
}