Latest News
Selasa, 09 Maret 2021

framework7: Membuat text select option word-wrap di smartSelect



smartSelect adalah salah satu fitur dari framework7 yang menyajikan halaman dinamis yang memudahkan user untuk menentukan pilihan dalam list yang banyak dengan fitur pencarian pilihan,grup kotak centang dan input radio.

Untuk penentuan pilihan bisa di tentukan secara manual maupun dinamis, pilihan bisa dilakukan secara banyak atau hanya satu item saja, dan pilihan banyak juga bisa dibatasi jumlah maksimal pilihannya.

Berikut adalah cara membuat select option text yang word-wrap, secara default jika text option terlalu panjang, secara otomatis akan di potong dan diganti dengan ..., seperti gambar diatas. Agar terlihat semua text dan mudah dibaca, harus ditambahkan style di cssnya.
 
Skrip untuk cssnya sebagai berikut:

     .smart-select .item-title { 

     text-overflow: ellipsis;

    word-wrap: break-word;

    white-space: normal; 

}

Dan hasilnya seperti gambar dibawah.

  • Blogger Comments
  • Facebook Comments

0 komentar:

Posting Komentar

Item Reviewed: framework7: Membuat text select option word-wrap di smartSelect Rating: 5 Reviewed By: ariesdev