wp-syntax, preタグ内の文字をFirefoxでも折返して表示したい

WordPress のプラグイン wp-syntax を使ってコード表記を行っています。
対応言語も多く助かっているのですが、1つだけ気になっていたことがあります。

Firefox だとコードが折返し表示されずに横スクロールバーが出てしまうことです。
Safariだと折り返して表示されています。

コードは pre タグ内に書くのでFirefoxの挙動は正常だとも思うのですが・・・

wp-syntax 付属の wp-syntax.css をカスタマイズすることにします。

プラグインフォルダのファイルを編集してしまうとアップデートの時に面倒くさいのでどうしようかとソースを見てると、テンプレートフォルダに同名の wp-syntax.css があればコチラが優先になるようになっていました。
それで、ダウンロードしたプラグインファイルから wp-syntax.css をテンプレートフォルダへアップロードしカスタマイズを開始しました。

変更した箇所は .wp_syntax pre へ以下の設定を末尾に2行追加しました。

white-space: -moz-pre-wrap;
white-space: pre-wrap;

これで良さそうだ。

カテゴリー: CSS, Plugin   タグ:   この投稿のパーマリンク

wp-syntax, preタグ内の文字をFirefoxでも折返して表示したい への2件のコメント

  1. ピンバック: wp-syntax Firefoxで折り返し表示 | WordPressを使いこなして稼ぎましょう

  2. ピンバック: wp-syntaxプラグイン Firefoxで折り返し表示 | Linuxサーバでお気楽生活 by あらかんおやじ

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">