homepage Welcome to WebmasterWorld Guest from 54.204.73.126
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Stumped by li a: hover
problems with text underline on mouse hover
breaker



 
Msg#: 4297636 posted 4:11 pm on Apr 14, 2011 (gmt 0)

So I've been trying initiate the hover psuedo class for links on my nav-bar. The code looks fine, so I'm thinking this issue may have to do with my using HTML5. I'd LOVE some help. Thanks. Here's the HTML and the CSS i'm using to style it.

<nav>
<ul>
<li><a href="/studio.html">studio</a></li>
<li><a href="/services.html">services</a></li>
<li><a href="/portfolio.html">portfolio</a></li>
<li><a href="/contact.html">contact</a></li>
</ul>
</nav>

CSS:

nav {
background-image: url(../images/backgrounds/nav_bg.png);
height: 40px;
background-repeat: no-repeat;
display: block;
}

ul{
font-family: Tahoma, Geneva, sans-serif;
margin: 0px;
padding-left: 265px;
font-size:18px;
line-height: 40px;
white-space: nowrap;
}

li{
list-style: none;
display: inline;
}

li a{
text-decoration: none;
color: #ccccbb;
padding: 7px 35px;
}

li a: hover{
text-decoration: underline;
color : #ccccbb;

}

 

rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 5+ Year Member



 
Msg#: 4297636 posted 6:17 pm on Apr 14, 2011 (gmt 0)

Welcome aboard breaker. I thought this at first, then validated an html 5 doc to verify it. You're going to laugh.

Take the space out in a: hover.

:-)

The pseudo class selector is not like setting rules, spaces mean something different in a selector. My **guess** is it's parsed as an anchor pseudo class

a:

with no name (null)

which contains some element tag "hover". Like this

#container h1 a

means an element with the id of container, containing an h1, inside which there is an anchor.

The W3C CSS Validator [jigsaw.w3.org] probably would have alerted you to this too.

breaker



 
Msg#: 4297636 posted 6:45 pm on Apr 14, 2011 (gmt 0)

Yup! You nailed it, rocknbil. Thanks a ton! And I will familiarize myself with jigsaw.w3.org. Thanks again!

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved