[wp-hackers] links move when hovered

kris feathers krichele at kfeathers.com
Fri Jan 14 01:28:28 UTC 2011


Hello,

I am working on twenty ten child theme and I can't figure out why the links
move when hovered. I want the links to be bold when hovered. I looked
everywhere..even on codex. Anyone have any suggestions would be greatly
appreciated.
here's the css:

#access {
    background: #95C0F4;
    display: block;
    float: left;
    margin: 0 auto;
    width: 940px;
    margin-left:52px;
    margin-top:161px;

}
#access .menu-header,
div.menu {
    font-size: 13px;
    width: 940px;
}
#access .menu-header ul,
div.menu ul {
    list-style: none;
    margin: 0;
}
#access .menu-header li,
div.menu li {
    float: left;
    position: relative;

}


#access .menu-header li:hover,
div.menu li:hover {
    float: left;
    position: relative;
    background: url(images/arrow.png) no-repeat scroll bottom center;
color:#ffffff;padding: 0px 0px 9px;
}


#access a {
    color: #ffffff;
    display: block;
    line-height: 38px;
    margin: 0 10px;
    text-decoration: none;
    font-size:18px;
    font-family:Arial, Helvetica, sans-serif;
}

#access li:hover > a,
#access ul ul :hover > a {
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    -webkit-border-radius: 4px;
    background: #f6c00e;
    color: #DB5628;
    font-weight:bold;

}
#access ul li:hover > ul {
    display: block;

}

#access ul li.current_page_item > a,
#access ul li.current-menu-ancestor > a,
#access ul li.current-menu-item > a,
#access ul li.current-menu-parent > a {
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
    background: #f6c00e;
    font-weight: bold;


}
* html #access ul li.current_page_item a,
* html #access ul li.current-menu-ancestor a,
* html #access ul li.current-menu-item a,
* html #access ul li.current-menu-parent a,
* html #access ul li a:hover {
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
    color: #fff;
    background: #f6c00e;
    font-weight: bold;
}
#access .menu-header li.current_page_item,
div.menu li.current_page_item {
    float: left;
    position: relative;
    background: url(images/arrow.png) no-repeat scroll bottom center;
color:#ffffff;padding: 0px 0px 9px;
    font-weight: bold;
}


Thank you!!!!!


More information about the wp-hackers mailing list