1

ここで私が使用しているコード:

<ul>
<li>TEXT<br>TEXT</li>
<li>TEXT<br>TEXT</li>
<li>TEXT<br>TEXT</li>
</ul>


ul {
    -webkit-column-count: 3;
    -webkit-column-gap: 90px;
    column-count: 3;
    column-gap: 90px;
    -moz-column-count: 3;
    -moz-column-gap: 90px;
}

問題は、Safari Mobile ではテキストの後のテキスト<br>がトリミングされることです (他のブラウザーでは問題ありません.. まあ、IE < 10 の場合、汚いハックを使用しますが、気にしません)。問題を再現できるページは次のとおりです: http://goo.gl/ojWx9

これは Safari Mobile のスクリーンショットです。 Safari iOS のスクリーンショット

4

1 に答える 1

1

大きな列のギャップと「空白: nowrap」が相まって、コンテンツが列を超えてはみ出しています。これにより、Mobile Safari でクリッピング バグが発生します。

テキストに合わせて列のギャップ サイズを小さくするか、改行を許可して問題を解決する必要があります。

于 2013-04-02T15:01:02.273 に答える