• Locked
1 reply [Last post]
Mon, 2012-04-30 07:23
eoppers
eoppers's picture
Offline
newbie
Last seen: 10 years 9 weeks ago
Timezone: GMT-4
Joined: 2012-04-30
Posts: 1
Points: 2

Hello All,

I appreciate if you really help me out, so i can get some sleep before faint.
When i am pointing submenus, top level menu text color changes into gray it should stay white as well when i am inside submenu.
I would be very happy if you help me out..

--------------------------------------------------

   <div id="navMenu">
 
    	<ul>
        <li><a href="#">HOME</a></li>
        <li><a href="#">ABOUT</a></li>
        <li><a href="#">CONSULTING</a>
        	<ul>
            <li><a href="#">Business Plan</a></li>
            <li><a href="#">Marketing Plan</a></li>
        	<li><a href="#">Incorporation</a></li>
        	<li><a href="#">Accounting System</a></li>
            </ul>
        </li>
 
        <li><a href="#">INDUSTRIES</a>
        	<ul>
            <li><a href="#">Industry1</a></li>
        	<li><a href="#">Industry1</a></li>
        	<li><a href="#">Industry1</a></li>
            <li><a href="#">Industry1</a></li>
            </ul>
        </li>
 
        <li><a href="#">OUR PROCESS</a></li>
        <li><a href="#">CAREERS</a></li>
        <li><a href="#">CONTACT</a></li>
 
        </ul><!-- end main UL-->
 
	</div>

-------------------------------------------
#navMenu {
	width: 100%;
	margin: auto;
	position: absolute;
	left: auto;
	right: auto;
}
 
#navMenu ul {
	margin:0;
	padding:0;
	width: 100%;
}
 
 
#navMenu ul li {
	padding:0;
	list-style:none;
	float:left;
	position:relative;
	margin-right:2px;
	width: 116px;
	height: 30px;
	background-color: #FFF;
}
 
#navMenu ul li a {
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	text-decoration:none;
	height:30px;
	width:100%;
	display:block;
	color:#666666;
	font-size: 10pt;
	line-height: 30px;
	margin-right: 2px;
	margin-bottom: auto;
 
}
 
#navMenu ul ul {
	position:absolute;
	visibility:hidden;
	top:30px;
}
 
#navMenu ul li:hover ul{
	visibility:visible;
	color: #FFF;
}
 
 
 
#navMenu li:hover {
	background-image: url(../images/menubaractive.png);
	background-repeat: repeat-x;
	color: #FFF;
}
 
#navMenu li:hover a { color:#FFF;}
 
 
 
#navMenu ul li:hover ul li a:hover{
	color: #FFF;
	background-image: url(../images/menubaractive.png);
	background-repeat: repeat-x;
	width: 216px;	
}
 
 
#navMenu a:hover {
	color: #FFF;
 
 
	}	
 
#navMenu a:focus {
	color:#FFFFFF;	
}
 
 
#navMenu ul li ul li {
	width: 224px;
	padding-left: 10px;
	text-align:left;
 
}
 
 
 
#navMenu ul li ul li a {
	text-align:left;
	padding-left: 8px;	
 
}

Code tags added - please read posting instructions at top of editing window, and preview before posting, thanks ~hugo.

Top
Tags:
Thu, 2012-05-03 02:16
#1
Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 3 weeks 5 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

Hi eoppers, This  #navMenu ul

Hi eoppers,
This  #navMenu ul li a is more specific then your attempts to keep it white.

Try something like:

#navMenu ul li a {
  color:#FFF;
}
 
#navMenu ul li li a {
  color:#666;
}

Top
  • Locked