火線上的負邊距換行問題（內聯列表）

Question

我正在使用分隔符（僅限CSS）的垂直菜單上工作。要在懸停時隱藏這些分隔符，我嘗試使用邊框+負邊距（取消邊框）。但在Firefox上它會創建一個換行符......我該如何修復它？由於

http://jsbin.com/akazuf/1/edit（嘗試在全輸出）

諾塔：懸停將是黑色，紅色是試驗。

號決議在這裏：Separators For Navigation :(

Answer 1

如果你不想換行都這樣做，你可以添加white-space: pre;到#header .nav a風格

https://developer.mozilla.org/en-US/docs/CSS/white-space

編輯：更好的解決方案可能會切換邊界方向（border-left至border-right,margin-right至margin-left：

#header .nav a { 
    border-right: 2px solid #000000; 
    font-family: 'Cuprum',sans-serif; 
    font-size: 14px; 
    padding: 0 25px; 
    text-transform: uppercase; 
} 

#header .nav .current-menu-item a, #header .nav a:hover { 
    background: none repeat scroll 0 0 #FF0000; 
    border-left: 2px solid #000000; 
    color: #FFFFFF; 
    margin-left: -2px; 
    padding: 14px 25px; 
    text-decoration: none; 
}