画像が含まれているテーブルをIE8で閲覧すると、(paddingがセットされたように)画像の上下左右に隙間があいてテーブルのサイズが変わってしまう現象にあいました。
横幅が同じサイズにもかかわらず、画像の縦幅によって、横幅が広がってしまう現象です。
HTMLとCSSの記述は下記の通りです。
CSSの記述
#AAAA {
width: 358px;
height: 208px;
}
#AAAA table{
width: 358px;
height: 208px;
border: 1px ridge #DDDDDD;
background-color: #FFFFFF;
border-collapse: collapse;
}
.BBBB{
display: block;
max-width: 350px;
max-height: 200px;
}
HTMLの記述
<div id="AAAA"> <table summary="画像"> <tr> <td> <img src="images/123.png" alt="123" class="BBBB" /> </td> </tr> </table> </div>
table の属性に、
table-layout: fixed;
を設定することで回避できました。
コメントする