Internet Explorer 问题答案

【问题标题】：Internet Explorer issueInternet Explorer 问题
【发布时间】：2012-07-07 08:05:33
【问题描述】：

此网站的中心内容部分存在问题。出于某种原因，在 Internet Explorer 中，只有几个字母被侧边栏截断了。我不知道为什么，或者如何解决它。 div 向右浮动，所以我想在右边添加几个像素的边距就可以了。它没有...

在 IE8 上就是这样，我实际上是在 Mac 上通过并行运行 IE 7.4。

有什么建议吗？

http://www.thesurgicalsolution.com/

【问题讨论】：

标签： css internet-explorer html margins

【解决方案1】：

在ie.css 中你有：

#content, .sidebar { overflow: hidden; }

仅在 IE 中剪切文本。因此，如果您删除此规则，文本将不再被剪裁。不过，这条规则的退出可能是有原因的，因此您可能希望在删除它之前测试整个网站。

编辑：我还会修复 validation errors 以及我过去在不同浏览器上遇到过由无效标记引起的无法解释的渲染问题。

编辑 2： #content 父 <div> 具有定义的宽度（并且是 overflow:hidden），但子 <div> 也具有定义的宽度，并且它的位置使其大于父项的右边缘，因此被父项的溢出规则剪裁。因此，作为替代方案，您可以使 .rightbox 更窄以避免溢出隐藏在 IE 中。

.custom #content .box-wrapper .rightbox {
    float: right;
    width: 451px; /* <-- change this */
    margin-right:5px;
}

【讨论】：

投票赞成，因为它部分正确，你唯一的问题是你正在使用的
的父

的宽度，451px 的宽度实际上大于你的空间有，将此宽度更改为较小的宽度将解决您的问题，并且您不必做任何其他事情。文本在其他浏览器上不会被截断，只是午餐时字体大小如何呈现和间隔，这真的不是 IE 唯一的问题，所以调整宽度。
@joseeight 如果您添加#content {overflow:hidden}，那么文本将在任何浏览器中被剪切。是一个 IE 唯一的问题，因为包含了一个额外的 IE 特定样式表，它具有此规则。

【解决方案2】：

我不知道为什么会发生这种情况，但是在适用于它的任何位置添加 padding-left: 3px 可以解决此问题。

【讨论】：