โดยปกติแล้วเรามักทำการตัดคำดวย PHP ครับ แต่ด้วย CSS3 เราสามารถใช้คำสั่งของ CSS3 ช่วยในการตัดคำแทนได้

ข้อดีของการตัดคำด้วย CSS3
เนื่องจากการตัดคำด้วย PHP การตัดคำจะถูกจัดการมาตั้งแต่ Server ซึ่งแน่นอนว่า ข้อความส่วนหนึ่งจะต้องขาดหายไปเมื่อมองจาก Search Engine แต่ถ้าเราตัดคำด้วย CSS3 ข้อความทั้งหมดจะยังคงถูกส่งมาซึ่งมีผลให้ Search Engine ยังคงเห็นข้อความทั้งหมดอยู่ แต่ CSS จะทำการตัดข้อความส่วนเกินออก เพื่อให้เราเห็นแทน

 white-space: nowrap;
 text-overflow: ellipsis;
 -o-text-overflow: ellipsis;
 -ms-text-overflow: ellipsis;
 overflow: hidden;
width: 150px;

white-space: nowrap; เป็นการกำหนดให้แสดงผลข้อความเพียงบรรทัดเดียวครับ
overflow: hidden; เป็นการกำหนดให้ซ่อนการแสดงผลในส่วนเกินครับ
width: 150px; เป็นการกำหนดขนาดพื้นที่ส่วนแสดงผล
text-overflow: ellipsis; เป็นการกำหนดให้เติม ... ต่อท้ายข้อความที่มีความยาวเกินกำหนดครับ (-o- และ -ms- เป็น prefix สำหรับบราวเซอร์อิ่นๆครับ)

จริงๆแล้วการตัดคำจริงๆไม่ได้เกิดจาก text-overflow นะครับ การตัดคำเกิดจากการที่เราบังคับให้บราวเซอร์แสดงผลเพียงบรรทัดเดียว และทำการซ่อนข้อความส่วนเกิน หากตัวอักษรมีความยาวเกินกว่าพื้นที่ที่กำหนด โดยที่ text-overflow ทำหน้าที่แค่จัดรูปแบบข้อความส่วนเกินเท่านั้น

ข้อมูลเพิ่มเติม http://www.w3schools.com/cssref/css3_pr_text-overflow.asp