This is probably a newbie mistake (I'm still learning CSS), but I am having trouble with changing the background-color for a:hover on my list items. I would like for the whole block to change from gray to white, and currently only the area behind the text changes color.
You can see the problem in both IE and Firefox at https://devel.library.dev1.apu.edu/library/KWtest/SCIL_site/scil.htm; this is a devel server, so you will likely get some security warnings--our server admin hasn't updated the security certificate in a while. Here's a screenshot if you don't want to risk it: http://www.flickr.com/photos/[EMAIL PROTECTED]/119449482/. Here's my CSS for the navigation links: /* navigation bar link area */ #navigationlinks{ float:left; border-bottom: 1px solid #666666; margin-top: -3px; /* Pulls up content to cover up browser-imposed gaps */ width: 170px; } /* navigation links; note that links are expressed as list items */ #navigationlinks ul { list-style: none; display: block; margin: 0; padding: 0; text-align: center; } #navigationlinks li { padding: 4px; border-top: 1px solid #666666; background-color: #dddddd; color: #333333; } #navigationlinks li a { width: 100%; } #navigationlinks li a:hover { background-color: #FFFFFF; } /* in-text link styles */ a:link, a:visited, a:active, a:hover{ color:#6699cc; text-decoration:none } Here's the HTML: <div id="navigationlinks"> <ul> <li>Home</li> <li><a href="#">About SCIL</a></li> <li><a href="#">Events/Reports</a></li> <li><a href="#">Minutes</a></li> <li><a href="#">Officers</a></li> </ul> </div> Could someone please tell me what I am doing wrong? Thank you so much! ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
