縮放時跳轉的菜單元素

問題如下：我有一個基本的無序列表，我用css變成了一個水平菜單。但是同時或出瀏覽器縮放，菜單項跳轉到下一行這樣：縮放時跳轉的菜單元素

未縮放：

|菜單1 | |菜單2 | |菜單3 | |菜單4 |

放大：

|菜單1 | |菜單2 | |菜單3 |
|菜單4 |

我該怎麼做才能避免菜單項目跳躍？

2012-04-20 Tomkarho

那是一個非常常見的問題，我已經看到了。我認爲這是因爲你以像素爲單位給出了寬度，所以當縮放並舍入到下一個寬度時，總和將變得大於100％。你可以嘗試使用％尺寸而不是像素。 – SinistraD 2012-04-20 17:47:26

使用％似乎已經穩定了大部分問題。謝謝你SinistraD。 – Tomkarho 2012-04-20 18:50:23

浮動父母（ul）我也有一個jQuery的解決方案，如果你想對齊中心的ul – 2013-06-17 18:47:30

嘗試試驗ul的固定（最小）尺寸（或可能包含ul的div）並給它一個溢出設置。例如：

ul { 
    width: 750px; 
    overflow:auto; 
}

2012-04-20 17:46:11 Armatus

尼斯方法，但如果項目有一個邊框，最後一個項目將失去其右邊框。 – SinistraD 2012-04-20 17:53:58

@SinistraD：怎麼這樣？ – 2012-04-20 17:57:32

我同意SinsitraD - 在那裏留下一點餘地。如果您使用百分比，我通常會嘗試留下〜2％的津貼。如果你更喜歡px作爲你選擇的單位，那麼一個1-2％的猜測津貼將覆蓋大部分舍入誤差。

您可能會發現瀏覽器之間的縮放行爲不一致 - 這是因爲大多數瀏覽器在縮放時使用不同的方法計算大小。

2012-04-20 17:51:58

嘗試應用position: relative在li元素

2012-04-20 17:52:55

回答