网站在除 IE7 之外的所有应用中都运行良好，答案

【问题标题】：Website works great in everything but IE7,网站在除 IE7 之外的所有应用中都运行良好，
【发布时间】：2010-11-28 07:55:29
【问题描述】：

我似乎无法弄清楚为什么我的网站在 IE7 中出现故障，我确信这与 CSS 中的某些内容有关，但我找不到它，这让我发疯了。我觉得我一直在看艺术品太久了，我看不出问题出在哪里。任何人都可以用全新的眼光进来并提供帮助吗？谢谢=)

网站：rburtonart.com

【问题讨论】：

你能详细解释一下问题是什么吗？你试过IE8兼容模式吗？如果是，结果如何？
如果有什么安慰的话，在 IE6 中工作得很好！
这里我要做的是发布 IE7 中的屏幕截图。詹姆斯你能帮我一个忙并在 IE6 中发布它的屏幕截图吗？给我大约 10 分钟，我会有一个链接
这是我的网站rburtonart.com/browers.jpg 使用 IE7、IE8、chrome 2、Safari 4、FF 3.5.3 拍摄的照片。正如您在 IE 7 中看到的那样，导航、中间部分和页脚都搞砸了。
这里是 CSS rburtonart.com/css/finerstyle.css的链接

标签： css web internet-explorer-7

【解决方案1】：

我无法确定问题所在，但如果您的 Internet Explorer 有问题（谁没有？），那么Conditional Comments 是您的朋友！

它们允许您添加仅在 IE 或特定 IE 版本中有效的代码。示例：

<!--[if IE]>
alternate style or stylepage for broken IE implemention of CSS
<![endif]-->


<!--[if IE 7]>
Fix for something broken only in IE7, not any other version.
<![endif]-->

这两者在任何其他浏览器中都不起作用——它们只是另一个无害的评论。如果您讨厌那些讨厌的 IE6 用户，您可以针对他们进行升级（升级到另一个浏览器或更新版本）。

编辑：找到了 在 IE8 之前，IE 存在浮动和布局问题。我认为这会起作用，因为我在类似情况下使用了类似的东西。

您需要添加一个包含 blcok-level 元素的条件注释来强制标题 DIV 下方的#content DIV。这应该是空的，并强制它下面的所有内容。
尝试在标题 div 的末尾和声明之间添加以下内容（第 79 行）。如果您看到标题和内容之间的空间太大，您可以修改它。

<!--[if IE 7]>
<div style="clear: both; width: 100%; padding:0; margin:0; height:1px;">&nbsp;</div> 
<!-- Fix for IE box model issues with content div -->
</div>
<![endif]-->

【讨论】：

那会是浏览器重定向脚本吗？
呃，如果你愿意，它可能是。对样式、附加样式表或一些附加 javascript 的修改更为常见。那行文字：你想要的任何东西都可以去那里，你想要多少行都行。如果浏览器匹配 if 条件，它将被取消注释。 ------ 美丽的讽刺：条件 cmets 功能应该是 IE 的额外奖励功能，以鼓励其使用。相反，它用于快速破解 IE 支持，因为 IE 具有糟糕的 CSS 支持。
哈哈哈喜欢。我认为这归结为我的 CSS 有问题。那可能是什么我不知道。我使用 W3C 进行了一些清洁，但它仍然一团糟。 rburtonart.com/browers.jpg
这看起来只是类似于 CSS 盒子模型的问题，这是 IE 中臭名昭著的一类臭名昭著的错误。我以前见过这种东西，调试起来很棘手。 IE8 将在标准模式下正常处理它，这就是它在那里呈现良好的原因，就像在非 IE 浏览器中一样。 IE6 可能已经坏了，它完全忽略了大块的样式，包括负责的部分。明天有时间我会去穿风格潜水；请记住，用投票来奖励好的答案并最终接受最好的答案是一种很好的礼仪（这也会给你带来声誉）。
啊，谢谢鲍勃不知道。我是该网站的新手，所以我试图了解一切是如何运作的。还认为您抽出时间提供帮助。如果我们能得出一个结论，我会更乐意检查一下。

【解决方案2】：

你没有说什么坏了，我也没有 IE7，但对于初学者来说，你的网站没有验证，无论是作为 XHTML Strict（你指定的文档类型）还是作为 CSS。我会在做任何其他事情之前修复验证错误。

【讨论】：

Firefox 的 Web 开发者扩展（如果您还没有的话，请与 Firebug 一起获取），而后者又使用 W3C 标准验证器。
da5id，IE 7 不能像其他浏览器一样正确渲染

【解决方案3】：

你的菜单和页脚需要

float: left;

你的中心部件在闪光灯的高度上存在错误......

我想你需要仔细看看。

IE 现在带有一个方便的开发人员工具，您可以在其中动态更改 css。

【讨论】：

这里是顶部菜单 CSS 代码 #menu { padding: 0;边距：0；列表样式：无；高度：27px；位置：相对； z 指数：500； } #menu li { margin-right: 0;文本对齐：居中； } #menu li a { 显示：块；向左飘浮;高度：27px；行高：20px；颜色：#fff;文字装饰：无；大纲：无；字体系列：Verdana、Geneva、Kalimati、sans-serif；字间距：0.15em；字体大小：.8em；填充：0 0 0 0； } 在#menu li a { 你可以看到“float:left;”如果我把它放在#menu { 它会弄乱整个菜单（选项开始相互叠加）
flash 电影也是 880 X 405 和 css #flashholder { width: 880px;高度：405px；背景：#121212；边距：10px 0px 0px 10px；向左飘浮; }
我认为 Kennethvr 是对的，#menu li 需要 float:left;添加到它#menu li { margin-right: 0;文本对齐：居中；向左飘浮; }
你是对的 ckarbass，Kennethvr 是对的。我最终尝试了它，它修复了 IE7 中的顶部和页脚菜单。现在剩下的唯一问题是为什么闪存区域（div“flashholder”）和内容区域（div“main”）相互重叠。这个答案不仅可以解决这个问题，还可以解决当前工作链接和其他艺术品链接上的重叠问题。也谢谢你们，这已经接近修复了，如果没有每个人的回复，我就无法做到！

【解决方案4】：

献出你的身体

background-color: #353535

将包裹的最小高度更改为例如

min-height: 650px

并将#main底部填充更改为例如

padding-bottom: 20px

这应该可以解决您的问题！在我的浏览器中可以！

【讨论】：

这是问题所在，我使用的是粘性页脚 (cssstickyfooter.com/using-sticky-footer-code.html)，所以 styleC.css 具有 html、body、#wrap {height: 100%;} body > #wrap { height ：汽车;最小高度：100%；背景：#353535； } 最小高度必须保持 100%，否则它会向上移动页脚并在底部留下一个间隙。
我相信这不是设置一个粘在底部的页脚的好方法。你为什么不设置一个页脚：位置：固定底部：0；看看这样的网站：matthewjamestaylor.com/blog/…sticky footer 在首页显示问题，这不是一个好的开始方式，是吗？
感谢您回复 Kennethvr，我明天会试一试，看看我能想出什么。这个方法看起来可行 =) 感谢您的关注！
好的，在查看 Matthews 示例并返回我的示例后，页脚在 IE7 中停留在底部。唯一的问题是您可以在主页上看到顶部内容和底部内容之间的巨大差距。一旦解决了这个问题，就可以将其应用于网站的其余部分。