So verhindern Sie das Umbrechen von CSS-Spalten mithilfe von Tailwindcss

Question

Mit tailwindcss habe ich das folgende HTML

<ol class="relative columns-1 sm:columns-3">
   <li>
       <img src="https://placehold.co/400x300">id=voluptas minus a qui tempore
   </li>
   <li>...</li>
   ...
</ol>

ol-bezogenes Tailwind-CSS ist

.sm:columns-3 {
   columns: 3;
}

Wie Sie sehen können (roter Pfeil), ist eine Einheit verpackt. Der andere Teil der Zelle befindet sich am unteren Rand der mittleren Spalte. Das ist etwas, was ich nicht will, keine Verpackung. Gibt es eine Möglichkeit, dies zu verhindern, oder sollte ich sicherstellen, dass alle Zellen die gleiche Höhe haben?

Answer 1

要防止 CSS 列在 Tailwind CSS 中换行，您可以使用 break-inside 属性。在