Programing Language/CSS
CSS ) div에서 2줄 이상 넘어갈때 ... 처리 하는 방법
Jude_Song
2023. 1. 30. 18:38
728x90
반응형
.card {
max-width: calc(100% - 38px);
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box; // 얘네를 추가히준다
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
- display: -webkit-box 속성은 해당 영역을 box 형태로 관리된다.
- -webkit-line-clamp 속성은 영역 내의 컨텐츠의 최대 라인수를 결정한다.
- -webkit-box-orient: vertical 속성은 영역 박스의 내의 정렬을 수직으로 만든다.
결과화면
두 줄로 잘보인다!
도움 되셨다면 하단의 광고 클릭 세엔스!!
728x90
반응형