TailwindCSS の切り捨てられたクラスは使用されないため、大量の水平スクロールが発生します

Question

Tailwinds truncate クラスの使用に問題があります: https://tailwindcss.com/docs/text-overflow#truncate

これは非常に賢いユーティリティのように見えますが、ブラウザはテキストが切り詰められないようにあらゆる手段を講じるようです。これには非常に長い水平スクロールも含まれますが、これは絶対に望ましくないことです。

ブラウザが切り詰められたテキストに対して寛容になるようにするにはどうすればよいですか?

Answer 1

レイアウトをよりよく理解するために、HTML コードを共有することもできます。

Tailwind で truncate テキストを正しく使用するには、切り詰められた要素にタグ <p> があることを確認してください。場合によっては、親要素を # に設定してみるとよいでしょう。 ## をブロックするか、w-full を使用するか、flex を回避してください。 リーリー

繰り返しますが、ソース レイアウトを見ないと、これが最適なソリューションであるかどうかを判断するのは困難です。水平スクロールは、グリッド レイアウト、画面サイズ、幅に基づくレスポンシブ レイアウトなど、Tailwind が提供するツールの多くを使用して回避できるためです。操作待ち。