縮放中斷可滾動的數據表

Question

我有一個頁面顯示一個交互式數據表，其標題和前兩個列（按鈕）固定。

在這里看到它。

該表包括四個部分（均具有自己的div）

1. 按鈕標題（ div#buttonHeader ）
   • 垂直和水平固定
2. 主標題（ div#mainHeader ）
   • 垂直固定，水平滾動
3. 按鈕主體（ div#buttonBody ）
   • 垂直滾動，水平固定
4. 主體（ div#mainBody ）
   • 垂直和水平滾動

問題在於，在不同的瀏覽器上縮放到不同級別（Chrome上為110％）會導致身體部位產生歪斜。

有沒有一種方法可以解決此問題而不破壞滾動功能？

Answer 1

有機會在聚會上查看您的代碼。 發現#buttonheader處於浮動狀態，但#mainBody由於明確設置了高度而無法清除它。

移除高度后，頁面流將按預期工作。 我的直覺是將59px的高度縮放到110％或64.9px，然后將其舍入並與#mainBody的邊框沖突。

道德是...不斷關閉DevTools中的樣式，直到找到沖突，然后找到另一種方式來解決它。