使用左邊距（在寬度為100％的元素上）顯示固定菜單時，避免使用水平滾動條

Question

在我的頁面中，左側有一個固定的菜單td （不隨頁面滾動），寬度為150px。 頁面容器的寬度為100％。 當您在某個元素上使用position:fixed時，它將元素帶出布局，因此您必須變通以確保可以看到所有內容。 因此，我在頁面容器上設置了margin-left:150px 。 這導致它從屏幕右上方溢出150px，從而顯示水平滾動條。

我不能只隱藏溢出，因為元素需要水平居中，並且它們在右邊看起來太遠了。 我無法使用JavaScript進行計算，因為菜單是可折疊的，因此每次折疊菜單時都需要重新計算寬度。 我也無法編輯HTML； 我正在使用CSS和JavaScript / jQuery重新設計一個網站。

這是一個可以更好地解釋我的問題的演示： http : //jsfiddle.net/3yBRV/4/embedded/result/

Answer 1

去除width: 100% !important; 從您的單元格擺脫水平滾動。 您的td元素將自己完成工作。

Answer 2

您想要通過box-sizing: border-box更改box-model box-sizing: border-box 。

http://css-tricks.com/box-sizing/

Answer 3

好，我知道了。 因為在屬性中td上的寬度設置為600 ，所以使用width: auto !important覆蓋該設置。