HTMLではみ出した文字を表示しない方法

IEでもChromeでもTDからはみ出した文字を消す
1. 普通にするとはみ出す
2. はみ出した分を消すには「overflow:hidden」を使う

IEでもChromeでもTDからはみ出した文字を消す

IEでもChromeでもHTMLでTABLEタグのTDからはみ出した文字を折り返えさずに消す方法です。

普通にするとはみ出す

以下のテーブルタグでは普通にTDの幅を超えた文字を指定すると隣のセルにはみ出して表示されます。

<table border="1" class="table_blue_stripe" width="60px" style="table-layout:fixed;">
<tr>
    <td width="30px">ABCDEFGHIJK</td><td width="30px">ab</td>
</tr>
</table>

はみ出した分を消すには「overflow:hidden」を使う

はみ出した分を消すにはsytle属性で「overflow:hidden」を使います。

<table border="1" class="table_blue_stripe" width="60px" style="table-layout:fixed;">
<tr>
    <td width="30px"><div style="overflow:hidden;">ABCDEFGHIJK</div></td><td width="30px">ab</td>
</tr>
</table>

どでしょう？
うまく消えましたか？

注意事項としてはtdタグには「overflow:hidden」が効かないのでdivタグを使う必要があります。