gpt4 book ai didi

css - Safari 不尊重填充

转载 作者:太空宇宙 更新时间:2023-11-04 02:22:42 24 4
gpt4 key购买 nike

我目前正在处理一个页面,上面有一系列 svg,使用(坦率地说令人惊叹的)d3.js 动态创建。

一切都很好,除了我在 Safari(Mac OS X 上的版本 9.1.1 (10601.6.17)(Yosemite,可在 El Capitan 和最新的 Safari 9.1 上重复))中遇到一个奇怪的问题,导致事情错位。我有两个彼此相邻的 svgs,它们出于所有意图和目的都具有相同的边距、填充等定义,但其中一个正确放置(填充顶部为 14px),而另一个(理论上也有14px padding-top) 似乎完全忽略了这个填充并且坐高了 14px。如下图所示,我使用了 Safari 内置的开发人员工具,并且填充似乎确实被正确定义,只是决定不关心。

left svg (correct)

相比于: right svg (incorrect)

值得注意的是,这个问题在我遇到的这些 svg 对中重复出现,所以它不仅仅是发生在一个实例中(在两个图像中你可以看到相同的现象反复出现)。

另一个奇怪/有趣的元素是,当我缩小(使用 ⌘ + ⇧ + -)时,问题似乎自行解决。这仅发生在默认缩放级别。

非常感谢任何帮助/指点。我不会以任何有意义的方式将自己描述为前端开发人员,我这样做确实是出于必要,所以我完全有可能在做一些非常非常愚蠢的事情。

这一切都可以在 Chrome 上完美运行。

最佳答案

跟进 olivier 之后的建议,我正在修复一些非整数的宽度/高度,不幸的是,这些宽度/高度没有用,但在这样做的同时,我正在查看填充并决定尝试调整它。长话短说,由于 svgs 试图完美触摸,显然 Safari 正在投球。在左侧 svg 上将 padding-right 设置为 0,在右侧 svg 上将 padding-left 设置为 0 似乎是个问题。解决方法是将两个填充都设置为 0.02px(似乎是我可以不给麻烦的最低值)。这在两个 svg 之间留下了非常微妙的接缝,但显然这是对未对齐它们的巨大改进。

关于css - Safari 不尊重填充,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37856567/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com