css - How to customize dropdown background-color while hover zurb-foundation 5 -


how can customize background-color while hovering <a href="#">find me</a>.
want change background-color while i'm hovering.
this's picture before hovering.

enter image description here

and this's picture after hovering

enter image description here

i want customize background-color @ " find me "
should add customize background color.

and this's code

<nav style="width: 1000px; margin: auto;" class="top-bar" data-topbar role="navigation">     <ul style="margin-right: 80px;" class="title-area">         <li class="name">             <h1><a href="#">my site</a></h1>         </li>         <!-- remove class "menu-icon" rid of menu icon. take out "menu" have icon alone -->         <li class="toggle-topbar menu-icon"><a href="#"><span>menu</span></a></li>     </ul>      <section class="top-bar-section">         <!-- left nav section -->         <ul class="left">             <li class="has-dropdown">                 <a href="#">find me</a>                 <ul class="dropdown">                     <li><a href="#">facebook</a></li>                     <li><a href="#">steamcommunity</a></li>                 </ul>             </li>         </ul>     </section> </nav> 

i believe css you're looking is: .top-bar-section li:not(.has-form) a:not(.button):hover

working fiddle (make sure screen wide enough see second link).

you can use developer tools inspect element, , modify see pseudo-class states.

i'd recommend learning how modify globals in foundation set can save lot of time rather overwriting foundation standards.


Comments

Popular posts from this blog

c++ - Delete matches in OpenCV (Keypoints and descriptors) -

java - Could not locate OpenAL library -

sorting - opencl Bitonic sort with 64 bits keys -