fieldset的padding由浏览器UA样式硬编码，box-sizing无效，必须显式重置fieldset和legend的padding/margin并统一用px单位，且需排查第三方库覆盖。
fieldset 的 padding 是浏览器硬编码的，不是 CSS 继承来的
Chrome 和 Firefox 的 UA 样式表里直接写了 fieldset { padding: 0.35em 0.75em; }，Safari（尤其是 ≤14 版）可能只应用上边距或完全忽略；这不是你漏写了样式，而是浏览器自己“悄悄加的”。box-sizing: border-box 对它完全无效，因为它不改变已声明的 padding 值，只影响尺寸计算逻辑。
legend 的定位逻辑独立于 fieldset 盒模型
即使你把 fieldset 的 padding 清空了，legend 仍会“浮”在顶部区域——它的位置由浏览器 UA 内部规则控制，和父元素的 padding-top 没有线性关系。常见现象包括：
- Safari 下
legend上移、文字被截断 - Chrome 下
legend看似正常，但实际占据的是fieldset的“内容区上方”，导致后续子元素垂直偏移 - IE8–11 中
legend可能完全脱离视觉流，甚至不渲染
px 单位是跨浏览器稳定的唯一选择
用 em 或 % 写 padding 会放大差异：
-
em依赖font-size，而各浏览器对fieldset的默认字号解析不同 - IE8 会直接忽略整个包含
box-sizing和em的声明块 - 旧 Safari 对
em的四舍五入策略不一致，导致像素级错位
所以必须写死：fieldset { padding: 8px 12px; } + legend { margin: 0; padding: 0; }，缺一不可。
立即学习“前端免费学习笔记（深入）”；
第三方 UI 库可能已经重置过 fieldset
像 Ant Design、Mantine 这类组件库，在 form 相关模块中往往隐式处理了 fieldset 的样式。如果你再全局写 fieldset { padding: 0; }，反而会破坏它们的布局节奏。排查方法很直接：
- 打开 DevTools，看 computed 样式里
padding的来源是user agent、your stylesheet还是ant-design.css - 优先用更具体的选择器，比如
.my-form fieldset，避免无差别覆盖 - 若项目已引入 Normalize.css 或类似 reset，注意它通常不碰
fieldset—— 它默认被排除在重置范围外
fieldset 和 legend 两个元素的 padding/margin，且不能依赖任何继承或通配符。 
