The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] border-bottom issue in Safari & Chrome

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #28327

    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:

    .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:


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


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


Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.