Safariがパディングを尊重していません

Question

私は現在、一連のsvgを持つページに取り組んでいますが、（驚くほど素晴らしい）d3.jsを使用して動的に作成されました。

MacOS X（ヨセミテ、最新のSafari 9.1でEl Capitanで繰り返し可能）でSafari（バージョン9.1.1（10601.6.17））で奇妙な問題が発生することを除いて、すべて問題ありません。私はすべての目的と目的のために同じマージン、パディングなどの定義を持っていますが、それらのうちの1つは適切に（14pxのパディングトップで）座っているのに対し、隣には2つのsvgがあります。 14pxパディングトップ）は、このパディングを完全に無視し、14px高く座っているようです。下の画像からわかるように、私はSafariのデベロッパーツールを使用しています。パディングは正しく定義されているようですが、気にしないことに決めました。

に比べ

：

私が持っているとして、それだけで両方の画像に（単一インスタンスで何が起こっていないので、それは、この問題は、これらのSVG-ペアの多くのために繰り返されていることは注目に値しますあなたは同じ現象が繰り返されるのを見ることができます）。

もう1つ不思議で興味深いのは、ズームアウト（⌘+⇧+ - を使用）したときに問題が解決されるようです。これは、デフォルトのズームレベルでのみ発生します。

どのようなヘルプ/ポインターにも大変感謝しています。私は自分自身をフロントエンドの開発者として意味のある方法で表現しているわけではありませんが、私はこれを本当に必要としているので、私は非常にばかげたことをしています。

これはすべてChromeで完全に機能します。

Answer 1

私はolivierの提案をフォローアップした後、残念ながらうまくいきませんでしたが、いくつかの非整数の幅/高さを修正していましたが、パディングを見ていて、それを調整しようと決めました。長いストーリーは短いですが、明らかにサファリは完全に触れようとしているためにフィット感を放っていました。左側のsvgにパディング右を0、右側のsvgに0を残してパディングを行うことが問題と思われました。修正は、両方のパディングを0.02pxに設定することでした（私が問題を起こさずに行くことができる最低のようです）。これは、2つのsvgの間に非常に微妙な継ぎ目を残しますが、明らかに、これはそれらのミスアライメントの大幅な改善です。