[스타일시스] 텍스트 overflow

[스타일시스] 텍스트 overflow

<div style="width:200px; text-overflow:clip; overflow:hidden;"> 
<nobr>제목이 긴 문자열로 이루어진 글을 테이블의 폭에 알맞게 잘라줍니다.</nobr> 
</div> 

<div style="width:200px; text-overflow:ellipsis; overflow:hidden;"> 
<nobr>제목이 긴 문자열로 이루어진 글을 테이블의 폭에 알맞게 잘라줍니다.</nobr> 
</div> 

<div style="width:200px; text-overflow:ellipsis; overflow:visible;"> 
<nobr>제목이 긴 문자열로 이루어진 글을 테이블의 폭에 알맞게 잘라줍니다.</nobr> 
</div>

//결과화면
제목이 긴 문자열로 이루어진 글을 테
제목이 긴 문자열로 이루어진 글을..
제목이 긴 문자열로 이루어진 글을 테이블의 폭에 알맞게 잘라줍니다.
// IE에서는 정상작동하고 파이어폭스에서는 ellipsis를 줘도 clip처럼 됩니다.

참고 : style="TABLE-LAYOUT: fixed" 와 nowrap 활용 하면 좋은 결과를 얻을 수 있다.

<TABLE style="TABLE-LAYOUT: fixed" cellSpacing=0 cellPadding=3 width="300" border=0>
	<TBODY>
		<TR>
			<TD noWrap>· 가나다라마바사가나다라마바사가나다라마바사가나다라마바사가나다라마바사가나다라마바사</TD>
			<TD></TD>
		</TR>
	</TBODY>
</TABLE>