缩放分行可滚动数据表

Question

我有一个页面显示交互式数据表的页眉和前两列（按钮）固定。

查看它here。

该表由四个部分组成（所有具有它们自己的div）

1. 按钮头（div#buttonHeader）
   • 垂直固定和水平
2. 主头（div#mainHeader）
   • 垂直固定，Scrol拉布勒水平
3. 按钮机构（div#buttonBody）
   • 滚动垂直，水平固定
4. 主体（div#mainBody）
   • 滚动垂直和水平

问题是，在不同浏览器上缩放到不同级别（Chrome上的110％）会导致身体部位呈现歪斜。

有没有办法解决这个问题，而不打破滚动功能？

Answer 1

有机会在聚会上看你的代码。发现#buttonheader浮动，但#mainBody无法清除它，因为高度被明确设置。

一旦我们删除了高度，页面流程按预期工作。我的直觉是，59px的高度被缩放为110％或64.9px，然后被圆整并以某种方式与#mainBody的边框相冲突。

道德是......不断关闭DevTools中的样式，直到找到冲突，然后找到一种不同的方式来完成它正在解决的事情。