Masalah dengan "white-space: nowrap" di Chrome 78.0.3904.70

10

Sejak rilis Chrome v78.0.3904.70, saya melihat masalah dengan menggunakan  properti CSS white-space: nowrap;. Ruang tanpa putus tampaknya menyebabkan jeda baris. Saat menggunakan text-overflow: ellipsis, teks yang sebenarnya tidak akan ditampilkan karena rusak di luar wadah. Tampaknya hanya terjadi jika teks terlalu panjang untuk ditampilkan.

.box-inline {
    max-width: 120px;
    overflow: hidden;
    height: 16px;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
}
<div class="mar-rgt box-inline text-sm"><span class="label" style="background: rgb(176, 223, 246);"></span>&nbsp;Not meeting expecations</div>
Luaskan cuplikan

masukkan deskripsi gambar di sini

Ini menyebabkan beberapa masalah tampilan pada aplikasi kami. Apakah ini bug atau ada yang salah dengan kode saya?

Kode ini sedang diterjemahkan dalam Bereaksi 16.

html css google-chrome whitespace Lucas Blackhurst
sumber
Chrome 78.0.3904.87 dirilis, saya tidak dapat mereproduksi masalah dengannya (mencoba cuplikan Anda). Bisakah Anda mencoba dan memberi tahu saya?
Syed Aqeel Ashiq

Jawaban:

1

Anda dapat menghapus "nbsp;" dan gunakan margin atau padding, itu akan berfungsi dengan baik.

Bug ini sudah dilaporkan https://bugs.chromium.org/p/chromium/issues/detail?id=1017465

Divyesh Rupawala
sumber
Terima kasih telah merujuk bug yang dilaporkan. Saya berharap itu sesederhana hanya menghapus & nbsp; tetapi ini terjadi dalam sistem live yang tidak bisa diubah begitu saja tanpa melalui proses rilis yang ketat.
Lucas Blackhurst