[Solved] border-bottom issue in Safari & Chrome

[flackjacket]

Hey All! Longtime reader, first time poster!

Here is my issue. When I "a:hover" in Safari (works in firefox 3.6) the 2px border i have marked up in my css does not function. The answer is somewhere in here:

Code:

.sideNav {font: 22px/1.3em bold; font-family: Arial; text-align: right; color: white; list-style-type: none; margin:0; padding:10px 0 0 0; }
.sideNav a {clear:both; text-decoration: none; letter-spacing: 1px; margin-bottom: 2px;}
.sideNav a:hover {border-bottom: 2px dotted; background-color: transparent; }

When I "float: left or right" and when I "display:block" the entire li width is bordered which I cannot have. The property works however, when it does it forces the <li> elements below it down 2px to accommodate the 2px dotted border…

I am totally brain farting on this. help!?

Thanks! Dan

You can view the page here: http://aspire-dance.com/

[flackjacket]

thanks jamy_za. Some careless coding on my part… I appreciate the extra eyes to catch my mistake.

[carmafluxus]

This just saved my evening (and my weekend as I’ve got a free Friday tomorrow).

Cheers!

[Author]

Posts