FullCalendarのイベントタイトルを折り返して表示したい

Question

FullCalendarのイベントタイトルが途切れてしまって見づらいので改行したいと考えているのですがうまくいきません。
FullCalendarのバージョンは5.4.0でWordPress 5.5.3で使っています。

イベントタイトルを囲んでいるdivタグのclassがfc-event-titleだったので、

div.fc-event-title {
    word-wrap: break-word;
}

と

div.fc-event-title {
    word-break: break-all;
}

を試してみたのですが途切れてしまいます
それぞれ、!importantを追加してみましたが結果は同じでした。

解決方法ご教示お願い致します。

Answer 1

こんにちは。

デモページを見てみたところ、white-space: nowrapを継承しているようでしたので打ち消してみてはいかがですか？

div.fc-event-title {
	white-space: normal;
}

---

nowrap
normal と同じくホワイトスペースを詰めますが、行の折り返しは行いません。

white-space - CSS: カスケーディングスタイルシート | MDN

Comments

[spbros]

ありがとうございます！！
ご教示頂いた方法で無事折り返して表示することが出来ました。