<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">在IE8中经常遇到的问题就是max-width,网页中图片的尺寸可能比较宽,我会给它设置max-width: 100%来限制其宽度最大为父容器的宽度,但是有时候却不奏效,慢慢摸索才得知IE解析max-width所遵循的规则:严格要求直接父元素的宽度是固定的。经实验发现Chrome所遵守的规则比IE松一些,所以这个问题应该不归属为IE兼容性问题,不过我还是提一下吧。分享两个我遇到的场景:</span>
(1)td中的max-width
如果针对td中的img元素设置max-width: 100%,在IE和Firefox你会发现不奏效,而在Chrome中却是可以的。经查询发现需要给table设置table-layout: fixed,对此属性的具体解释见W3School。
(2)嵌套标签中的max-width
如下的HTML结构:
<div class="work-item">
<a href="#" class="work-link">
<img src="sample.jpg" class="work-image img-responsive">
</a>
</div>