为什么这个页面看起来不同的IE，Firefox和Chrome的

之间看一看这个html page。为什么这个页面看起来不同的IE，Firefox和Chrome的

在Firefox中，它看起来就像我希望它看起来，在IE中它看起来“有点奇怪”，并在Chrome中它都扭曲。

我使用的是什么非标准HTML，这使得它在浏览器之间看起来如此不同？具体来说，我如何修复Chrome浏览器版本，使其更像Firefox？

请注意，如果所有或几乎所有列都有黄色粘贴，Chrome浏览器只会出现故障。如果一列或两列为空，则Chrome会像Firefox一样显示该页面。

编辑 - 这里是the fixed page。

来源

2010-05-10 ripper234

截图和你所期望的将是巨大的。 – 2010-05-10 05:26:11

在我看来，一张表不应该用于日历，因为它是一个日期列表，而不是一个信息网格。但我明白这样做更容易进行布局。 – 2010-05-10 05:43:26

@Justin - 这里是在Chrome浏览器截图：http://dl.dropbox.com/u/464119/kuzando/bad-chrome.png – ripper234 2010-05-10 06:14:11

页没有一个DOCTYPE。有一个人告诉浏览器你的页面符合标准是很重要的。从那里开始，并确保您的网页通过您选择的DOCTYPE的验证。

更新：确定验证的好工作！你现在的问题是table元素跟在两个浮动div上，没有任何清除。您必须清除浮动元素，以便下列元素正确地排列在其下方。

请尝试以下操作。谷歌“清除”更优雅的解决方案。

<div style="float:left">.... 
<div style="float:right">.... 
<br style="clear:both"/> 
<table ....

来源

2010-05-10 04:58:27

我修复了验证，问题仍在发生。 – ripper234 2010-05-10 05:08:46

@ ripper234：查看更新的答案。 – 2010-05-10 05:17:25

工程就像一个魅力，谢谢！ – ripper234 2010-05-10 06:18:43

如果可能，尝试验证你的CSS和HTML。这通常有助于消除最大的故障。

validator.w3.org来

来源

2010-05-10 04:55:05

我固定的验证和问题仍然发生。 – ripper234 2010-05-10 05:09:17

一个我不得不建议是确保，如果你想跨浏览器友好的代码是有效的第一件事情。

张贴的代码出现33个错误。

FF不像其他浏览器那么挑剔，并且在有效代码方面给了很大的余地。

尝试验证和修正有效性问题，然后再检查;它可能看起来好一点。

来源

2010-05-10 04:55:15 Douglas

问题是这是由javascript生成的HTML。我使用Firefox保存了HTML的静态快照，这肯定会破坏有效性。原始呈现的HTML是有效的。 – ripper234 2010-05-10 05:02:49

在那里，我确定了验证，它仍在发生。 – ripper234 2010-05-10 05:08:29

正如已经提到的那样，需要确定的一些更重要的事情是确保包含DOCTYPE。没有人，浏览器很难说出他们在看什么。小心你如何评论你的代码。弹出的第一个错误之一是“文档类型不允许元素”h2“在这里”。尽管它在评论中，但它可以作为兴趣点在浏览器中弹出。一些浏览器试图通过允许编码中的小错误来“帮助”开发人员，但这有时会使事情变动。 – Douglas 2010-05-10 05:13:28

浮法您的日历表上的差异左

来源

2010-05-10 05:45:33

为什么这个页面看起来不同的IE，Firefox和Chrome的

回答

相关问题