CSS：停止列表项在悬停时轻推？

Question

我有一个在悬停时需要虚线边框的菜单，是否可以阻止它在悬停时将列表项轻推？

http://jsfiddle.net/mkTvp/

它将在CMS中，因此我无法在LI的

上设置宽度

Answer 1

为物品提供2px透明边框：http://jsfiddle.net/mkTvp/1/

Answer 2

只需将边框添加到与背景颜色相同的原始样式：

li {
    display: block;
    float: left; 
    padding: 3px;
    border: 2px solid #fff; /*same as background color*/
}

Example here

Answer 3

a {
    background-color: #F78F1E;
    color: #fff;
    display: block;
    font-family: helvetica, sans-serif;
    font-size: 0.688em;
    font-weight: bold;
    padding: 12px 12px;
    text-decoration: none;
    text-transform: uppercase;
    width: auto;

}

li {
    display: block;
    float: left; 
    padding: 1px;
    border: 2px solid white; /** Same as background-color */ 
}

li:hover { border: 2px dashed #F78F1E;}