Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS subnav text hover color not working
    primarykey
    data
    text
    <p>I am having trouble getting the subnav menu text to change color when you hover over it. What I am trying to build is a navigation menu that has a subnav. The hover state for the subnav links changes the background color and text color. I haven't been able to get this to work, currently only the background changes on rollover, and not the text. </p> <p>Here is a link to an example of the navigation: <a href="http://confinedfoodie.com/test/contact.html" rel="nofollow">http://confinedfoodie.com/test/contact.html</a> The subnav can be found under "video post" in "WHAT WE DO".</p> <p>Here is the HTML:</p> <pre><code>&lt;nav id="primary-nav"&gt;&lt;!-- Navigation --&gt; &lt;ul&gt; &lt;li&gt;&lt;a href="#nowhere"&gt;WHAT WE DO&lt;/a&gt;&lt;!-- what we do --&gt; &lt;ul&gt;&lt;!-- hidden links level 1 --&gt; &lt;li&gt;&lt;a href="radio-production.html"&gt;Radio Production&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="voice-casting.html"&gt;Voice Casting&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#nowhere"&gt;Video Post&lt;/a&gt;&lt;!-- video post --&gt; &lt;ul style="width:170px;"&gt;&lt;!-- hidden links level 2 --&gt; &lt;li &gt;&lt;a href="mix-to-picture.html"&gt;Mix to Picture&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="adr-film-tv.html"&gt;ADR for Film &amp; TV&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt;&lt;!-- End hidden links level 2 --&gt; &lt;/li&gt;&lt;!-- END video post --&gt; &lt;li&gt;&lt;a href="isdn-services.html"&gt;ISDN Services&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="pharma.html"&gt;Pharmaceutical&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="audio-books.html"&gt;Audio Books&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt;&lt;!-- End hidden links level 1 --&gt; &lt;/li&gt;&lt;!-- END what we do --&gt; &lt;/ul&gt; &lt;/nav&gt;&lt;!-- /Navigation --&gt; </code></pre> <p>Here is the CSS:</p> <pre><code>nav ul ul li a { padding: 5px 10px; color: #c8c8c8; } nav ul ul li a:hover { color: #fff; background: #2b191c; } </code></pre> <p>Any help is appreciated, thank you in advance.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload