[CSS] 테이블 자동 줄바꿈

[CSS] 테이블 자동 줄바꿈하는 방법

---

테이블 자동 줄바꿈 하려면

<table> 태그에 "table-layout: fixed" 속성을 추가해서 테이블 크기를 고정시킨 후

줄바꿈을 하려는 태그 <table>, <tr>, <td> 등에 "word-wrap: break-word;" 속성을 추가하면 된다.

 

table {
	table-layout: fixed;
}

td {
	word-wrap: break-word;
}

 

 

 

※  word-wrap 속성 종류

• normal : 일반 줄바꿈 지점에서만 줄을 바꿈 ( default )
• break-word : 줄을 바꿀 만한 지점이 없을 경우 임의의 지점에서 줄을 바꿈.

 

 

---

[참고] https://www.w3schools.com/cssref/css3_pr_word-wrap.asp