ใส่ ... เมื่อข้อความยาวด้วย CSS

ตัวอย่างนี้เป็นการกำหนดให้ข้อความตัดอัตโนมัติเมื่อยาวเกินกว่าขอบเขตการแสดงผล โดยใช้ css ในการตัดด้วยคำสั่ง overflow โดยมีการกำหนดดังนี้

<div class="post-title">
    <h2>ทดสอบข้อความหัวเรื่องยาวๆ</h2>
</div>

สำหรับ css จะเขียนดังนี้

.post-title h2 {
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    text-overflow: ellipsis;
}

การแสดงผลจะได้ลักษณะดังนี้

// ทดสอบข้อความ...