【问题标题】:IE8 Keeps Breaking My ColumnsIE8 不断打破我的专栏
【发布时间】:2012-10-24 15:18:36
【问题描述】:

我正在开发一个新网站 - http://cravezilla.com - 在 WordPress 上运行。我已经针对 Chrome、Mozilla、Safari 和 IE9+ 优化了该网站。但是,在 IE8 上,我网站的栏目都被扔掉了,我不知道为什么?

我附上了我的 IE8 预览截图。我可以在 CSS 中包含一些东西来解决这个问题吗?

图片如下:

【问题讨论】:

  • 我已投票结束此问题,因为它对您的网站过于具体,不太可能帮助任何未来的访问者。最好的问题有一个独立的小示例,其中包含的代码刚好足以演示问题,没有任何额外内容。将此代码直接发布到问题中。这样做可能需要做很多工作,但它是解决问题过程中的关键部分。

标签: css wordpress internet-explorer-8 frontend


【解决方案1】:

在你的 css 文件中试试这个

.tri-block:last-child{
    margin-right:0;
    }

【讨论】:

    【解决方案2】:

    您正在使用 IE8 不支持的 box-sizing 属性。事情是你有一个 950px 固定宽度的 3 个元素的包装 div。并且您指定每个元素的宽度为 33.3%,内边距为 8px。它适用于 box-sizing,因为填充没有添加到宽度中。并且由于 IE 没有该方法并将填充添加到宽度,您将获得 33.3% + 33.3% + 33.3% + 填充值,该值比 950px 固定大小更宽,并导致第三个元素浮动到新行。

    我建议您删除 box-sizing 属性并将这些 div 的固定宽度设置为 300 像素左右。它应该在您的 css 文件中的第 483 行。

    希望对你有帮助。

    【讨论】:

    • 感谢您的及时回复。我会去测试这些。谢谢!
    • Box-sizing 不过很酷。将其保留在 IE8 中可能会更好。
    • 这是真的斯科特。他可以只为 ie 使用特殊的 css,并将其保留为 Firefox 或其他浏览器。
    • 使用下面的代码有意义吗? .tri-block:last-child{ margin-right:0;那么 IE 的特殊 CSS 会是什么?谢谢。
    猜你喜欢
    • 2012-09-02
    • 1970-01-01
    • 1970-01-01
    • 2011-10-06
    • 2018-01-23
    • 2021-06-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多