pagetop

PRE中の文字を折り返す

このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加このエントリをLivedoor Clipに追加このエントリをYahoo!ブックマークに追加このエントリをFC2ブックマークに追加このエントリをNifty Clipに追加このエントリをPOOKMARK. Airlinesに追加このエントリをBuzzurl(バザール)に追加このエントリをChoixに追加このエントリをnewsingに追加このエントリをTwitterに追加

アドレスなど長くなってしまう物をPREに記述すると、親要素のサイズをはみ出して表示される物を収まるようにするCSSです。

html

<div id="box">
<pre>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</pre>
<pre id="oru">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</pre>
</div>
css
div#box {
	width: 300px;
	border: 2px solid #FF0000;
	padding: 5px;
}
#oru {
	/* Mozilla */
	white-space: -moz-pre-wrap; 
	/* CSS3 */
	white-space: pre-wrap; 
	/* IE 5.5+ */
	word-wrap: break-word;
}

Post a Comment

Eメールは必ず 入力してください。. *このマークが付いている物は必須項目です。

*
*

clear
clear

a