Tailwindcss を使用して CSS 列の折り返しを防ぐ方法

Question

tailwindcss を使用すると、次の html があります

リーリー

ol に関連する Tailwind CSS は

です リーリー

ご覧のとおり (赤い矢印)、セルが折り返されています。セルの他の部分は中央の列の下部にあります。これは私が望んでいないものです、パッケージはありません。これを防ぐ方法はありますか、それともすべてのセルの高さを同じにする必要がありますか?

Answer 1

CSS 列が Tailwind CSS で折り返されないようにするには、break-inside プロパティを使用します。

要素で Break-inside を void-column に設定すると、要素が複数の列に分割されなくなります。次のロジックを試すことができます。 リーリー

break-inside-avoid-column Tailwind CSS によって提供されるユーティリティ クラスで、break-inside プロパティを void-column に設定します。これにより、各

要素が分割されずにその列内でそのまま残ることが保証されます。