css trouble

  • Resolved ke vinritt

    (@ke-vinritt)


    15 years, 3 months ago

    I have totally screwed up the menu in my header here – been trying to fix it for over an hour – HELP!
    Here’s the list pages function:

    <ul id="headernav"><?php wp_list_pages('title_li='); ?></ul>

    and here’s the css I am using:

    #headernav {
	width: 900px;
	margin: 0 auto;
	padding: 5px 0;
}
#headernav li {
	display: inline;
	padding: 4px 0;
}
#headernav li a:link, a:visited, a:active {
	padding: 6px 25px;
	color: #ffffff;
	font-size: 13px;
	text-transform: uppercase;
	font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;
	text-decoration: none;
}
#headernav li a:hover {
	text-transform: uppercase;
	font-size: 13px;
	font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;
	color:#6CA014;
}

    The text in the menu (blue banner) is supposed to be white and then green when you rollover it. Can some one tell me where I am going wrong?

Viewing 2 replies - 1 through 2 (of 2 total)

  • This line

    #headernav li a:link, a:visited, a:active

    is incorrect if you’re just trying to target your navigation links. Should be:

    #headernav li a:link, #headernav a:visited, #headernav a:active

    But if it’s a simple colour change you’re looking for, try this instead:

    #headernav {
	width: 900px;
	margin: 0 auto;
	padding: 5px 0;
}
#headernav li {
	display: inline;
	padding: 4px 0;
}
#headernav li a {
padding: 6px 25px;
color: #fff;
font-size: 13px;
font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif; }

#headernav li a:hover, #headernav li a:active, #headernav li a:focus {
text-transform: uppercase;
color: #6CA014; }

    Si

    Thread Starter ke vinritt

    (@ke-vinritt)

    Thank you. What does a:focus do?

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘css trouble’ is closed to new replies.