我正在尝试将边框半径悬停效果应用于导航链接，但我似乎无法让它比这更大（http://i.imgur.com/OhHIJSw.jpg）。这是我的代码片段：

CSS:

.nav a:hover {
    background: #091D6C;
    color: #fff;
    border-radius: 1em;
}

.HTML：

<ul class="nav">

   <li class="home"><a href="#">Home</a></li>

</ul>

如果有人能帮忙，那就太好了。这是我的学校项目，这个星期到期。谢谢！

下面是我导航的CSS：

.globalheader .navigation li {
    display: table;
    width: 100%;
    font-weight: 600;
}

.globalheader .navigation .nav {
    display: table;
    table-layout: fixed;
    list-style-type: none;
    margin: 0;
    padding: 0;
    padding-left: 1.2em;
    padding-right: 1.2em;
    height: 5.8em;
    overflow: hidden;
}

.navigation {
    position: relative;
    min-height: 4.8em;
    margin-bottom: 2.4em;
    border: .1em solid transparent;
}

抱歉我的问题没有说得更清楚，谢谢你的快速回复！