Jika membahas text-overflow mungkin anda akan bertanya-tanya untuk apa sih? Nahh....kali ini saya akan berbagi Share Info and Knowledge mengenai text-overflow ini. Mungkin selama ini sobat blogger sering menggunakan kodingan pada PHP untuk membatasi banyaknya kata/kalimat yang akan ditampilkan ternyata di CSS juga bisa kok.
Berawal dari project web e-commerce saya di kantor maka dari itu saya ingin membahas mengenai text-overflow ini. hehehe...
Ketika itu saya menemui kendala bagaimana cara membuat text menyesuaikan dengan pembatas (border), sehingga nantinya text tersebut akan terpotong menyesuaikan pembatas / border. Mungkin contohnya seperti gambar di bawah ini
Berikut contoh kodingannya,
.border .batasi {
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
Seperti itulah kira-kira script di CSS untuk membatasi text dari border / pembatas. Jangan lupa buat juga di HTML <div class="batasi">
</div>
</div>
Untuk lebih jelasnya anda bisa berkunjung ke :
- http://www.quirksmode.org/css/textoverflow.html
- http://www.w3schools.com/cssref/pr_text_white-space.asp
Semoga bermanfaat. :D
1 komentar:
arigato
Post a Comment
Catatan : Berkomentarlah dengan baik dan sopan. Karena penulis memberi kebebasan berkomentar tanpa melalui moderasi. Dilarang menaruh link website di kotak komentar karena akan langsung dihapus. Pilih profile Name/URL apabila ingin meninggalkan link/backlink.