Internet Explorer 上非常奇怪的 CSS 问题。我不知道出了什么问题！ [关闭]答案

【问题标题】：Very Strange CSS problem on Internet Explorer. I have no idea what is wrong! [closed]Internet Explorer 上非常奇怪的 CSS 问题。我不知道出了什么问题！ [关闭]
【发布时间】：2010-10-07 15:26:56
【问题描述】：

我刚刚测试了我在 Internet Explorer 中设置的网站。当然在 Firefox 中运行良好。我有一组样式表，其中大部分都有背景图片，用户可以随意选择不同的样式表。除了颜色和背景之外，样式表的呈现完全相同，当然基于文本的版本呈现不同。无论如何，我还有一个字体大小更改器，因此用户可以选择最适合他们的字体大小。当我加载大字体时，我有 4 个设置，从小、标准、大和 Xlarge，bg 图片到达我的 div 的末尾，这很好。然而，当我使用小字体和标准字体大小时，bg 图片仅占应有大小的 5%。也许下面的图片可以帮助您理解我的问题。

干杯 CHL

Ps fontsize css 仅包含类的字体大小和 id 不包含背景样式。

问题： http://www.webquark.co.uk/project/problem.bmp

处理较大的字体大小： http://www.webquark.co.uk/project/working.bmp

在 Firefox 中工作的样子： http://www.webquark.co.uk/project/firefox.bmp

这是我设置 bg 的 css：

.content{
background-image: url(springBG.jpg);/**Change for season**/
background-attachment:fixed;
background-position:top center;
background-repeat:no-repeat; 
font-family: Calibri, Ariel, sans-serif;
}

【问题讨论】：

@Dana：哪个IE版本？
你一定有诀窍，因为这个问题把我的 Firefox 搞砸了！ :-)
图片太大，无法包含，我看不懂问题:(
我建议将这些 BMP 转换为其他压缩图像格式 - 将近 2MB 降下来！

标签： css internet-explorer firefox font-size

【解决方案1】：

“Internet Explorer 上的 CSS 问题。我不知道出了什么问题！”

这在我的办公室几乎每天都能听到。

我唯一的建议是尝试设置背景元素的高度。

【讨论】：

【解决方案2】：

说到 CSS 问题，你帖子中的标签框下面的内容溢出了。

【讨论】：

【解决方案3】：

尝试在白色 div 与背景重叠后清除浮动（其中包含所有单词）。最简单的方法是添加：

<div class="spacer"></div>

就在白色 div 的结束标记之后。如果这不起作用，请尝试将其添加到白色 div 的结束标记之前的行。间隔的 CSS：

.spacer
{
    clear: both;
    height: 0;
    line-height: 0;
    font-size: 0;
}

【讨论】：

【解决方案4】：

你能发布生成的 HTML 吗？

我猜 IE 在您的容器中看不到任何具有“内容”类的内容。这可能是因为内部内容没有“hasLayout”（一个神奇的IE东西）

按照 TM 的建议，尝试将高度设置为“1%”，这应该会触发 hasLayout，或者设置“缩放：1；”这也可以解决问题。

【讨论】：

【解决方案5】：

在您的 CSS 声明中，您使用“Ariel”字体名称。这个应该是不存在的。宋体，就是这样。爱丽儿是某种清洁剂。

实际上，正确的非衬线序列声明应该是：

font-family: Calibri, Tahoma, Arial, Helvetica, Sans-Serif;

【讨论】：

【解决方案6】：

您可以继续使用速记 css 作为背景，如下所示：

background: url(yourimage.jpg) no-repeat top center;

另外，ie6 不支持 background-attachment:fixed 以外的 body。

【讨论】：

【解决方案7】：

如果不查看其余代码或实时站点，很难确定，但这看起来像是一个经典的包含浮动问题。处理此问题的最简单方法是将overflow: auto 添加到包含您的浮点数的框中（我猜这是.content，这里）。这应该会将壁纸拉伸到适当的高度。

如果失败，请尝试将 Logan suggested 的“clearfix”分隔符添加到 .content div 的末尾。

【讨论】：

【解决方案8】：

您好，我发现了设置 div 高度所需的问题。对于那些提到这一点的人，我已经向您的代表添加了一点，并感谢您的建议：D

CHL

CSS：

  height:100%;

【讨论】：