Problem z „white-space: nowrap” w Chrome 78.0.3904.70

10

Od wydania Chrome w wersji 78.0.3904.70 widzę problemy z używaniem  właściwości CSS white-space: nowrap;. Nieprzerwana przestrzeń wydaje się powodować łamanie linii. Podczas używania text-overflow: ellipsisrzeczywisty tekst nie będzie wyświetlany, ponieważ jest uszkodzony na zewnątrz kontenera. Wydaje się, że dzieje się tak tylko wtedy, gdy tekst jest zbyt długi, aby go wyświetlić.

.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>
Rozwiń fragment kodu

wprowadź opis zdjęcia tutaj

Powoduje to kilka problemów z wyświetlaniem w naszych aplikacjach. Czy to błąd, czy coś jest nie tak z moim kodem?

Ten kod jest renderowany w React 16.

html css google-chrome whitespace Lucas Blackhurst
źródło
Chrome 78.0.3904.87 został wydany, nie mogę odtworzyć problemu z nim (wypróbowałem swój fragment). Czy możesz dać mi znać?
Syed Aqeel Ashiq

Odpowiedzi:

1

Możesz usunąć „nbsp;”i użyj marginesu lub wypełnienia, będzie działać dobrze.

Błąd został już zgłoszony https://bugs.chromium.org/p/chromium/issues/detail?id=1017465

Divyesh Rupawala
źródło
Dziękujemy za odwołanie się do zgłoszonego błędu. Chciałbym, żeby to było tak proste, jak usunięcie & nbsp; zdarza się to jednak w systemach na żywo, których nie można zmienić bez przechodzenia przez ścisłe procesy wydania.
Lucas Blackhurst