Javascript/Vue.js
table data 가 너무 길 경우 해결방법 (table over-flow text in cell)
table data 가 너무 길어서 생각했던 디자인과 달라지는 케이스가 발생할 수 있다. 해결하려고 방법을 찾아보고 정리해보았다. 1. CSS 로 조정 max-width: 200px; overflow: hidden; text-overflow: ellipsis; 디자인에 맞게 td 의 크기를 제한하고 overflow: hidden 옵션으로 max-width 를 벗어나는 내용을 숨긴다. text-overflow: ellipsis; 옵션을 추가하면 끝에 잘리는 부분을 ... 으로 표시해준다. 2. td 안의 내용을 일부만 표현 {{result.message}} {{result.message.substring(0,40)+"...."}} v-if else 구문을 이용해서 원하는 만큼의 내용만 표시한다. 실 적용에..
2021. 2. 4. 10:00
최근댓글