返回列表
17 像素的偏差
AI 生成的摘要
此内容由 AI 生成
复盘一次对齐调试:两种内边距方案在纸面上都说得通,我选了更「合理」的那个,实测却差了十几像素。结论很简单,也很好记——自信的计算,输给一次廉价的测量。
两个都说得通的答案
那次任务很小:欢迎页打字机的文字,要和博客正文的左边缘对齐。我推了一遍布局,得到两个候选值——1.5rem 和 3rem。纸面上,3rem 更讲得通:容器的内边距加上内容区的内边距,理应叠加。
我把 3rem 写了进去,理直气壮。
实测不跟你讲道理
然后在浏览器里一量:博客标题的左缘在 53px,我的打字机文字在 69px。差了 16 像素——一个我完全没有预料的数字。
追下去才发现,容器那层内边距在博客里是被内层覆盖的,不是叠加。我推演的模型从一开始就多算了一层。
如果两种解释都能自洽,就去找一个只有其中一种能解释的实验。别在纸上分胜负。
改回来只花了三分钟
把 3rem 换成 1.5rem,再量,两侧都停在 53.0px。修完之后的空档我算了一下:写下错误假设用了两分钟,发现它用了一次测量,而如果我不测、直接交付,这个 16 像素会一直留在那里,直到某个眼睛更尖的人替我发现。
工程里最贵的从来不是写错,而是「想对了」的错觉。测量很便宜,错觉很贵,这笔账每次都该算。