html – SVG foreignObject和绝对定位

概述当我在svg：foreignObject中的html对象上使用它时,我遇到了绝对和相对定位的问题. 我已经制作了这个jsfiddle以证明我的问题. div.wrapper应该与svg：g中的rect位于相同的位置,并且div中的段落应该按照css中的描述定位. 我在以下浏览器(Mac)中遇到问题： > Safari 6.0.3 > Chrome 26.0.1410.63 > Maxthon 4. 当我在svg：foreignObject中的HTML对象上使用它时,我遇到了绝对和相对定位的问题.

我已经制作了这个jsfiddle以证明我的问题.

div.wrapper应该与svg：g中的rect位于相同的位置,并且div中的段落应该按照CSS中的描述定位.

我在以下浏览器(Mac)中遇到问题：

> Safari 6.0.3
> Chrome 26.0.1410.63
> Maxthon 4.0.3.6000.

它的工作方式与我在firefox 19.0.2中的预期相同.

我的代码有问题吗？有谁知道如何解决这个问题？

UPDATE

我找到了this bug,这可能是问题所在.看起来在issue tracker for webkit上有很多关于foreignObject的问题.

如果某人有一个解决方法,如何将段落放在div的角落,我将不胜感激.

解决方法 很长一段时间以来这个帖子和BUG仍然存在.

我实际上发现如果你在foreignObject元素中使用x =“50”Y =“50”属性,它在Chrome中按预期工作.

我知道它与变换不一样,但至少你可以正确定位你的内容.

总结

以上是内存溢出为你收集整理的html – SVG foreignObject和绝对定位全部内容，希望文章能够帮你解决html – SVG foreignObject和绝对定位所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。