カテゴリ名がタグのように折り返されず、モバイルでオーバーフローが発生

皆さん、こんにちは。フィルターのドロップダウンのタグ名は、長すぎると次の行に折り返されることに気づきましたが、これはモバイルでの応答性に優れています。しかし、カテゴリ名には同じ動作が見られないようです。カテゴリ名が長すぎると、フィルターコンテナからはみ出し、モバイルデバイスでのレイアウトが崩れてしまいます。
問題を説明するために、2つのスクリーンショットを以下に示します。


「いいね!」 4

カテゴリ名が長すぎると、トピックリストでもはみ出してしまいます。これは非常に些細なことで、わずかに関連しているだけなので、新しいトピックを作成する代わりにここに残しておきます(必要であれば移動していただいて構いません)。

カテゴリ名は理想的には短くすべきであり、この動作を見たのは初めてでした。

「いいね!」 6

これを回避するためにいくつかの調整を加えました。

長いカテゴリ名でさらに問題が発生した場合は、お知らせください!

「いいね!」 3

@awesomerobot

これも、スレッド下部にある「Suggested」投稿のカテゴリ名に関する問題のようです。

2つの別個だが関連する問題があるようです。

  1. ページ読み込み後にビューポートサイズを縮小すると、テーブルが正しく縮小されません。

これにより、table.topic-list#main-outlet-wrapper の幅を超えてしまいます。


  1. 別途、h3.more-topics__browse-more a.badge-category__wrapper が省略されません(ページが読み込み時にモバイルサイズであったか、縮小されたかに関わらず)。これもページが幅を取りすぎる原因となります。max-width: 80vw などで強制的に省略できますが、広いモニターでは意図しない結果になる可能性があります。

「いいね!」 1

トピックリストの長いカテゴリ名にまだ問題があるという印象です。
これは、CFL Forums で表示されているものです。カテゴリ名は切り捨てられていますが、日付はまだ右に寄りすぎです。

また、チャットでカテゴリに言及することも問題です。

「いいね!」 1