Переполнение таблицы Safari / WebKit при использовании пробелов: nowrap

Question

Возникла странная проблема с рендерингом в Safari:

У меня есть столик внутри div. Внутри стола

У меня осталось много плавающих элементов. Таким образом, нормальное отображение - это все элементы div внутри td, сложенные влево, пока они не заполнят ширину, затем не перейдут к следующей строке и так далее. Так что-то вроде этого:

|===========================|
|  |---------------------|  |
|  | XXX  XXX  XXX  XXX  |  |
|  | XXX  XXX            |  |
|  |                     |  |
|  |----------------------  |
|===========================|

Это работает во всех браузерах, кроме safari / webkit, где в итоге получается что-то вроде этого:

|===========================|
|  |-------------------------------|
|  | XXX  XXX  XXX  XXX  XXX  XXX  |
|  |                               |
|  |-------------------------------|
|===========================|

Обновление: наконец выяснил проблему: мои внутренние div ("XXX") имели white-space: nowrap. Очевидно, webkit не оборачивал весь список div вместо того, чтобы применять nowrap внутри div.

Это было противно.

(Это не имеет ничего общего с дисплеем: нет)

Answer 1

На самом деле, я задал свой вышеупомянутый вопрос отдельно, затем я нашел решение, как большой мальчик:

Вместо использования пробела: nowrap, в этом случае более уместно использовать display: inline-block.

CSS должен быть адаптирован здесь и там для изменений, но он работает как положено.

Элементы с Nowrap застряли на смежные элементы в WebKit

Answer 2

Отвечая на мой вопрос:

Наконец выяснил проблему: у моих внутренних div'ов ("XXX") был пробел: nowrap Очевидно, webkit не оборачивал весь список div вместо того, чтобы применять nowrap внутри div.

Это было противно.

(Это не имеет ничего общего с дисплеем: нет)