IE8显示：table-cell和max-width错误？ [英] IE8 display: table-cell and max-width bug?
问题描述
嗨。
我正在设置一个小型相册类型的东西，我使用PHP设置一个图像列表供访问者点击。
这很简单。
然而，我在IE8中遇到了一个奇怪的错误。
因为图像可以都是不同的大小（我无法做到这一点......在我的控制之外），我使用CSS技巧使它们全部在垂直和水平方向上居中，并缩小到适当的大小。 br />
基本上，我将图像标签放在两个div标签内，第一个用于水平对齐div，第二个用于水平和垂直对齐图像。
然后，图像标签使用 max-height 和 max-width 样式缩小大图像。
这一切看起来像这样：
（添加边框以查看div的确切位置）
Hi.
I''m setting up a small photo-album-type thing, where I use PHP to set up a list of images for visitors to click through.
That''s all simple enough.
However, I''m having a weird bug in IE8.
Because the images can all be of different sizes (nothing I can do about that... outside my control), I use a CSS trick to get them all centered both vertically and horizontally, and scaled down to a proper size.
Basically, I put the image tag inside two div tags, the first one to align the divs horizontally, and the second to align the image both horizontally and vertically.
Then the image tag scales down images that are to large using the max-height and max-width styles.
That all looks like this:
(Added the borders to see the exact position of the divs)
推荐答案
您是否找到了解决此问题的方法？我遇到了同样的麻烦，但我似乎无法解决它。您可以提供的任何帮助/见解将非常感激。 ：）
Have you found a solution for this problem? I am having the same trouble, but I can''t seem to fix it. Any help/insight you can provide would be much appreciated. :)
我很遗憾地说我没有办法解决这个问题。
原因是IE8中令人敬畏的新标准支持渲染引擎（讽刺意图）中的错误，直到修复（如果有的话），将导致表格元素按比例缩小比例。
我想一个JavaScript解决方案是可能的。
只有当max-width设置的内容（在我的情况下是一个图像）缩小到确切地说是指定的值。
如果你用JavaScript捕获这些情况并进一步缩小图像，理论上应该避免这个问题。
或者你可以只是让JavaScript动态缩放图像，完全跳过最大宽度场景。
我没有测试过这个（我已经放弃了我的Windows分区），所以我不能肯定地说，但至少听起来似乎有道理。
I''m sorry to say that I did not find any way to work around this.
The cause of this is a bug in IE8''s awesome new standards-supporting rendering engine (sarcasm intended) which, until fixed (if ever), will cause table-cell elements to scale out of proportion like that.
I suppose a JavaScript solution would be possible.
This only appears to happen when the contents (in my case, an image) with max-width set scales down to exactly the value specified.
If you were to catch those cases with JavaScript and shrink the image further, it should, in theory, circumvent the problem.
Or you could just have JavaScript dynamically scale the image, skipping the max-width scenario altogether.
I haven''t tested this (I''ve abandoned my Windows partitions since I posted this), so I can''t say for sure, but it at least sounds plausible.
享受这些乐趣。特别是最后一个：
IE 8中存在以下回归：
*浮点旁边的新块格式化上下文的最小宽度有时被视为宽度。
*百分比宽度浮动导致合理的文本移动。
*自动溢出的浮动最大宽度失败。
*滚动条高度被添加到最大高度而不是减去它。
*最大高度作为带有滚动条的元素的高度。
*组合最大高度，浮动和溢出：滚动将导致整个页面消失。
Have fun with these. Especially the last one:
The following regressions are present in IE 8:
* Min-width on new block formatting context beside a float is sometimes treated as width.
* Percentage width floats cause justified text to move.
* Max-width fails on floats with auto overflow.
* Scrollbar height is added onto max-height instead of subtracted from it.
* Max-height acts as height on elements with scrollbars.
* Combining max-height, float and overflow:scroll will cause the entire page to disappear.
这篇关于IE8显示：table-cell和max-width错误？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
