html - Make text in drop down menu white -
this website.. when hover on nav items , drop down list appears, want drop down list have white text permanently, not turn white.
also if knows how make when hover on menu items black line appears under word not whole background of word goes black?
http://opax.swin.edu.au/~9991042/ddm10001/brief_2/amalfi%20coast/www_root/
#nav { padding: 50px; width: 924px; height: 100px; float: none; } #nav ul { list-style: none; margin-left: 5px; width: 1000px; display: table; } #nav { text-decoration: none; color: #161717; } /*hide sub menu*/ #nav li ul { display: none; } /*show , position*/ #nav li:hover ul { display: block; position: absolute; margin-left: 0px; margin-top: 0px; } /*main nav*/ #nav li { width: 140px; font-size: 14px; display: inline-block; -webkit-transition: ease 0.3s; } #nav li:hover {} /*sub nav*/ #nav li li { color: white; display: block; background-color: black; font-size: 11px; padding-top: 5px; padding-left: 5px; width: 100px; } #nav li li:hover { background-color: #a83133; } #nav a:hover { color: white; }
<div id="nav"> <div id="firstnav"> <ul> <span class="font4"><li><a href="#">sign in</a></li> <li><a href="#s1">sign up</a></li> <li><a href="#s2">my trip</a></li> </ul></span> </div> <ul> <li><a href="#1">destinations</a> <ul> <li><a href="#1.1">popular places</a> </li> <li><a href="#1.2">other places</a> </li> </ul> </li>
i'm unsure if question top-link turning black when not being hovered
the reason happening put hover on a
-element. a
-tags default inline elements. means take space text.
this means when hover on li
-element hover on link no longer in effect.
you change color of link when hover on li
-element instead.
#nav li:hover { color:white; }
as black line. add border bottom either li
-elements(if want full lenght) or a
-elements(if want long word)
#nav li:hover { border-bottom: 1px solid #000; }
edit: sollution top menu-item turning black when hovering. issue or did want change color of sub-items?
if can following
#nav li li { color:white }
Comments
Post a Comment