Javascript 图表在非IE浏览器中显示在同一行，但在IE浏览器中显示在下一行

以下是您可以自己尝试的确切代码：

当我在IE中渲染时，每个图表显示在不同的行中。 当我在除IE之外的任何其他浏览器中渲染它时，图表显示在同一行上，就像内嵌元素一样

---

发生了什么事？这是什么原因？有什么办法吗

对我来说，所有人都是以内联方式加载的原因是什么？因为SVG具有由浏览器的用户代理关联的内联属性。我不知道你用的是哪款IE浏览器，但我用的是IE 10.0，chrome和firefox也是最新的。所有内容都以内联方式显示

ps:SVG不能在IE小于8的情况下正常工作

---

修复方法：尝试使用CSS减少svg的高度和宽度。由于某种原因，它可能会被推到下一行。

对于我来说，所有人都以内联方式加载。原因是什么？因为SVG具有由浏览器的用户代理关联的内联属性。我不知道你用的是哪款IE浏览器，但我用的是IE 10.0，chrome和firefox也是最新的。所有内容都以内联方式显示

ps:SVG不能在IE小于8的情况下正常工作

---

修复方法：尝试使用CSS减少svg的高度和宽度。由于某种原因，它可能会被推到下一行。

在我尝试过的所有浏览器（最新的Chrome 26、最新的Firefox 19和IE 9）中，你的图表都会在两行上呈现

---

它们包含在宽度为960px的

中。每个

图表的宽度是500px，因此如果没有某种浮动定位，它们当然不能并排显示。调整图表大小或使用CSS使其重叠（或者，如果这不是目标，则使用CSS强制它们堆叠）。

在我尝试的所有浏览器（最新的Chrome 26、最新的Firefox 19和IE 9）中，您的图表在两行上呈现

---

它们包含在宽度为960px的

中。每个

图表的宽度是500px，因此如果没有某种浮动定位，它们当然不能并排显示。调整图表大小或使用CSS使其重叠（或者，如果这不是目标，则使用CSS强制其堆叠）。

谢谢，您能给我一个CSS示例，我可以使用它使其重叠吗？我同意user113215。确保它们始终堆叠的一种方法是将它们中的每一个放入自己的文件夹中div@BDotA“重叠”是什么意思？要将两个图表精确地放在彼此的顶部，您可以使用类似于

position:absolute；排名：0；左：0

。如果您希望两个图表并排放置（这将导致第二个图表的一部分从页面的右边缘溢出并且不可见），请将它们放在一个宽度为1000px的

的

中。谢谢，您能给我一个CSS示例，我可以使用它使它们重叠吗？我同意user113215。确保它们始终堆叠的一种方法是将它们中的每一个放入自己的文件夹中div@BDotA“重叠”是什么意思？要将两个图表精确地放在彼此的顶部，您可以使用类似于
position:absolute；排名：0；左：0
。如果您希望两个图表并排放置（这将导致第二个图表的一部分从页面的右边缘溢出并且不可见），请将它们放置在宽度为1000px的
中。谢谢，我必须在IE 7和IE 8中进行测试。。。我使用的是IE8，因此我也使用R2D3项目，如果IE为8+，他们使用相同的D3，并使用Raphael为IE7和IE8渲染：但他们也提到Raphael是不一致的。它在某些情况下有效，而在其他情况下无效。这只是一个解决方案，而不是修复方案。你应该让你的用户转向IE 9。由于IE8缺乏渲染一致性等级，我必须在IE7和IE8中进行测试。。。我使用的是IE8，因此我也使用R2D3项目，如果IE为8+，他们使用相同的D3，并使用Raphael为IE7和IE8渲染：但他们也提到Raphael是不一致的。它在某些情况下有效，而在其他情况下无效。这只是一个解决方案，而不是修复方案。你应该让你的用户转向IE 9。因为IE8缺乏渲染一致性