« Mail-QmailQueueの修正 | メイン | バリ行ってきました。 »

CLB with HTML::Parser バージョンアップ

CLB with HTML::Parserのバージョンアップをした。

CLB with HTML::Parser ver. 0.02 [ダウンロード]

MacのIEで、preタグにoverflow:autoをつけると中身が消えるというバグがあるので、それを回避するために、preタグをdivで囲みました。

<div class="code"><pre>〜</pre></div>

と自動的に変換されます。

これで、スタイルシートを

.blogbody .code pre{
	font-family:monospace;
	font-size:8pt;
	color: #666666;
	margin:3px;
	padding:0px;
}

.blogbody .code{
	background: #eeeeee;
	margin:0px 2px 10px 2px;
	overflow: auto;
	width:auto;
}


とすればよいと思ったのだが、これだと、MacOS XのIEでどうも、画面が崩れれる。
なのでここでみつけた、@mediaで囲んでしまう方法を利用。
あと、overflow:autoだと、WindowsのIEでも縦スクロールがでることで、表示が汚くなるので、

	line-break:strict;
	word-break:break-all;
	word-wrap:break-word;

をいれて、事実上、overflowを使わないようにした。
最終的には、

.blogbody .code pre{
	font-family:monospace;
	font-size:8pt;
	color: #666666;
	line-break:strict;
	word-break:break-all;
	word-wrap:break-word;
	margin:3px;
	padding:0px;
}

.blogbody .code{
	background: #eeeeee;
	margin:0px 2px 10px 2px;
	overflow: hidden;
	width:95%;
}

@media screen {
	.blogbody .code{
		overflow: auto;
		width:auto;
	}
}

こんな感じで使用中

トラックバック

この一覧は、次のエントリーを参照しています: CLB with HTML::Parser バージョンアップ:

» PRE文 from trashbox.org
MTのソースコードを記載するのに皆様いろいろ困っているようです。 Convert... [詳しくはこちら]