จัดข้อความยาว ให้อยู่ในกรอบ ด้วยคำสั่ง CSS word-wrap :break-word

หน้าหลัก » CSS Design โดย pun July 31, 2014 1:05 am
บทความนี้ มาแนะนำวิธีการแก้ปัญหาข้อความล้น div หรือ tags อื่นๆ ล้นกล่องข้อความที่เราสร้างเอาไว้ ก่อนหน้านี้ผมก็ งง เหมือนกันหาวิธีแก้ไขอยู่ค้นไปเจอพอดี แนะนำให้คำสั่ง word-wrap:break-word; ก็เลยลองดูได้ผลครับ
รูปแบบการใช้คำสั่งก็ไม่ยากครับ

ตัวอย่าง

[caption id="attachment_2587" align="aligncenter" width="537"]CSS word wrap break word CSS word wrap break word[/caption]

Code CSS

[php]
<div style="word-wrap:break-word;">
ข้อความ ข้อความ ข้อความ ข้อความ ข้อความ ข้อความ
</div
[/php]

ลองนำไปใช้ดูครับ นี้เป็นเพียงตัวอย่างสำหรับท่านที่เคยเขียน css มาบ้างแล้วคงไม่ยากอะไร สำหรับมือใหม่ลองคัดลอง code นี้ไปลองดูครับ

จัดข้อความยาว ให้อยู่ในกรอบ ด้วยคำสั่ง CSS word-wrap :break-word


บทความโดย pun