Safari / WebKit dépassé lors de l'utilisation d'espaces: nowrap

Question

Avoir un problème de rendu étrange avec Safari:

J'ai une table à l'intérieur d'une div. À l'intérieur de la table & Lt; td & Gt; J'ai beaucoup de div flotté à gauche. Ainsi, l'affichage normal correspond à tous les divs du td empilés à gauche jusqu'à ce qu'ils remplissent la largeur, puis passent à la ligne suivante, et ainsi de suite. Donc, quelque chose comme ça:

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

Cela fonctionne dans tous les navigateurs sauf safari / webkit, où il finit par ressembler à ceci:

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

Mise à jour: Le problème a enfin été résolu: mes divs internes (les & "XXX &";) avaient white-space: nowrap. Apparemment, webkit ne couvrait pas la liste complète des divs au lieu d’appliquer le nowrap au sein de la div.

C'était méchant.

(Cela n'a rien à voir avec l'affichage: aucun)

Answer 1

Répondant à ma propre question:

Enfin résolu le problème: mes divs intérieurs (les & "XXX &"; s) avaient un espace blanc: maintenant. Apparemment, webkit ne couvrait pas la liste complète des divs au lieu d’appliquer le nowrap au sein du div.

C'était méchant.

(Cela n'a rien à voir avec l'affichage: aucun)

Answer 2

En fait, j’ai posé la question ci-dessus séparément, puis j’ai trouvé la solution comme un grand garçon:

Au lieu d'utiliser white-space: nowrap, dans ce cas, il est plus approprié de choisir display: inline-block.

Le CSS doit être adapté ici et là au changement, mais il fonctionne comme prévu.

Les éléments avec nowrap restent bloqués aux éléments adjacents dans WebKit