html - 图像在 Firefox/IE 中保留完整大小，但在基于 webkit 的浏览器中完美运行

Question

我一辈子都无法解决我网站图片的这个问题。

我已经尝试在 img 元素上使用 -moz-box-sizing: border-box; 无济于事，我无法解决这个问题。

图像在 Mozilla Firefox 和 Internet Explorer 10 中似乎保留了完整的 500x250 大小，但在 Google Chrome 和 Apple Safari 中可以正常工作和格式化。

我已将 HTML 和 CSS 输入到 JSFiddle 中，图像仍然存在，可以找到 JSFiddle here并包含相关部分所需的所有代码。

响应功能已被删除以减少代码的大小，因此它不会折叠成一个单独的列。

在我精神崩溃之前，请提供一些帮助，谢谢。

Answer 1

您的 div 没有宽度(.alignLeft 和 .alignRight)

尝试这样的事情 http://jsfiddle.net/W5Edb/1/

    .alignLeft {
      width: 100%;
    }
    .alignRight {
      width: 100%;
    }

您必须调整边距或减少 div 的百分比，但您明白了，应该能够按照您需要的方式进行布局