css - :hover with elements

Question

我正在与:

#top ul li.corner span.right-corner:hover
{
    background-image:url("images/corner-right-over.gif");
    width:4px;
    height:15px;
    float:left;
}

#top ul li.corner span.left-corner:hover
{
    background-image:url("images/corner-left-over.gif");
    float:left;
    width:4px;
    height:15px;
}

而且我似乎无法让 :hover 正常工作？不知道为什么，有人有什么建议吗？

Answer 1

我认为问题在于 SPAN 元素默认显示内联 - 这意味着它们没有高度和宽度。尝试通过添加明确地使它们成为 block 级元素:

#top ul li.corner span.right-corner, #top ul li.corner span.left-corner
{
    display: block;
}