[CSS] 테이블 TD의 가로폭에 따라 폭을 넘는 글자 "..." 표시

1. td 내부에 할당 사이즈를 넘는 텍스트를 "..." 으로 표시해야할 경우 테이블을 고정시켜야한다.

2. 테이블은 가변적이기 때문에 고정시켜야 반응형웹에 맞게 사이즈가 조절된다.

<style>
.inner_list {white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 556px;width: 90%;}
 </style>

<table style="width:100%; table-layout:fixed">
<colgroup>
    <col style="width:10%;">
    <col style="width:70%;">
    <col style="width:20%;">
</colgroup>
<tbody>
<tr>
    <td>1</td>
    <td>
        <div class="inner_list">
            TEST 글 TEST 글 TEST 글TEST 글 TEST 글 TEST 글 TEST 글TEST 글
            TEST 글 TEST 글 TEST 글TEST 글 TEST 글 TEST 글 TEST 글TEST 글
            TEST 글 TEST 글 TEST 글TEST 글 TEST 글 TEST 글 TEST 글TEST 글
            TEST 글 TEST 글 TEST 글TEST 글 TEST 글 TEST 글 TEST 글TEST 글
            TEST 글 TEST 글 TEST 글TEST 글 TEST 글 TEST 글 TEST 글TEST 글
            TEST 글 TEST 글 TEST 글TEST 글 TEST 글 TEST 글 TEST 글TEST 글
        </div>
    </td>
    <td>
        3
    </td>
</tr>
</tbody>
</table>

3. style="table-layout:fixed"