오버 플로우가 td 내부의 div에서 작동하지 않습니다.

Question

그래서 오버 플로우 속성을 td 내부의 div에서 작동 시키려고합니다. 그러나 td의 너비를 백분율로 설정합니다. 따라서 사전에 모르기 때문에 div의 너비 (픽셀 내부)를 픽스 수로 설정할 수는 없습니다.

<table id="table"> 
<thead> 
    <tr> 
     <th>column 1</th> 
     <th>column 2</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
     <td><div class="cell">Aaaaaaaaaaaaaabbbbbbbbba</div></td> 
     <td><div class="cell">bbbbbbbbbbbbbaaaaaaaaaaabb</div></td> 
    </tr> 
</tbody> 
</table>​ 


#table { 
    width:100px !important; 
} 

th { 
    width:16% !important; 
    border: 1px solid black; 
} 

.cell{ 
    width:100%; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    -o-text-overflow: ellipsis; 
    -webkit-text-overflow: ellipsis; 
    white-space: nowrap; 
    } 

http://jsfiddle.net/2Sync/

어떤 아이디어가?!

고마워요!

Answer 1

당신은 다음과 같은 CSS 규칙을 추가 시도 할 수 있습니다 :

#table{ 
    table-layout:fixed; 
    overflow:hidden; 
    white-space: nowrap; 
} 

이 this post에 더 확인하시기 바랍니다.

Answer 2

Nevermind ... 나는 테이블 레이아웃을 사용했습니다 : 고정; 그리고 효과가있었습니다!