【メモ】 GridSystemなどのリセットCSSを導入してXdebugが改行されなくなってしまった場合

ダンプの結果を綺麗に整形して表示してくれるモジュール「Xdebug」はPHP開発の定番ですが、今開発しているサービスであるタイミングから表示が崩れてしまいました。具体的には改行されなくて1行になってしまう（上画像参照）。

PEAR/PECLの変更も行っていたのでサーバの設定の問題だと考えてあれこれいじっても直らず、結果的にはGridSystem導入によるリセットCSSの影響であることが解りました。なんだそれ。





具体的には、この部分。


xdebugの表示に使われている「pre」タグに「white-space: normal」が設定されてるために表示が崩れてたと。

わかってみれば超簡単なことで、難しく考えすぎてしまってました。問題の切り分けって大事ね。

というわけで

以下の設定を行って、リセットCSSの設定を上書きしてやればOK。

pre.xdebug-var-dump {
white-space: pre;
}

で、こうなります。



やれやれ。