概要

次のように曜日毎に改行を入れて編集したテキストがあったとします。

これをWebページで表示したら次のように改行が無視された状態になってしまいました。

これを次のように表示するようにするための方法のメモです。

方法

改行を効くようにする

もともと改行が無視されてしまったテキスト全体を<a>タグで囲っていたのですが、これを<pre>タグに変更しました。ただし、このままだと、上図の5/20のデータが折り返さずに切れてしまいました。

長過ぎるテキストを折り返すようにする

こちらは以下のCSSを設定しました。

white-space: pre-wrap;