Wednesday, February 27, 2019

Perpaduan css white-space: nowrap dan word-wrap: break-word

Penggunaan white-space: nowrap dan word-wrap: break-word pada css mempunyai peranan masing-masing, keduanya dapat mempengaruhi sebuah Konten atau elemen.


white-space: nowrap css yang dapat digunakan tanpa ada baris baru.

word-wrap: break-word css yang digunakan agar isi tidak keluar dari konten.

contoh css nowrap dan break-word

keterangan :

contoh hasil css white-space: nowrap dan word-wrap: break-word, lihat pada konten / garis


Penulisan CSS :

white-space: nowrap

p { white-space: nowrap;
}

word-wrap: break-word

p { word-wrap: break-word;
}

Kita dapat menggabungkan kedua css tersebut terutama pada konten yang menggunakan tabel atau border agar isi tetap berada di dalam konten dalam keadaaan apapun.

Contoh lain dalam penerapan pada css tooltip

css nowrap dan break-word pada Tooltip

keterangan :

contoh penggunaan pada css Tooltip white-space: nowrap dan word-wrap: break-word, ex: 2 css yang sudah digabungkan.



CSS EXAMPLE

p { word-wrap: break-word;
white-space: nowrap;
}

Demikian semoga bermanfaat.

No comments: