[1일1코딩][CSS] text-overflow + over-flow

 

    overflow: hidden; ← 넘어간 내용을 감춘다. 
    text-overflow: ellipsis; ← 넘어간 내용을 ... 처리해준다

.cardBoxText{
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis;

}

 

<div class="cardBoxText">
    <div class="">
      <strong class="d-inline-block mb-lg-1 text-success reviewCategory">중식</strong>
      <h5 class="card-title cardTitle">중화요리 팔공</h5>
      <p class="card-text mb-1 reviewDate">22.02.22 | 조회수 50회</p>
      <p class="card-text mb-auto reviewNormal">위치 : 서울 관악구 신림동 10-621 지하 1층</p>
      <p class="card-text mt-3 mb-auto reviewFeatureTitle">간단 소개</p>
      <p class="card-text reviewNormal">푸짐한 양과 아낌없는 재료
        푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료
      </p>
      <!-- <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> -->
    </div>
</div>