« トトラ流ハーツ道 | メイン | ドメイン取得ー »
2005年10月07日
pre要素にスクロールバー [DOM]
pre要素は自動改行しないので、親要素の幅以上になっても文字を折り返さず横領域を圧迫してしまう。結果として横スクロールが発生したり、段組レイアウトではデザインが崩れてしまう。
その対処策として
pre { overflow-x: scroll; width: 100%; }をセットする方法もあるが、IEなどのブラウザでは overflow していなくても上記のようにスクロールバーがついてしまう。DOMで何とかできないか少し探ってみた。
var elmsPre = document.getElementsByTagName("pre");
for(var i=0; i elmPre.parentNode.offsetWidth){
elmPre.style.overflowX = "scroll";
}
}
}
このようにすれば、IE6の互換モードでは上手くいった。しかし標準準拠モードではダメだったし、Moz系でも同様だ。これで上手くいってしまうのは、単にIEのバグを利用しているからである。真っ当なブラウザなら、はみ出した領域も計算に入れて親要素を拡張してしまう。
色々調べてみたが満足な答えは得られずじまい。どなたか有効な手段を教えていただければ幸いです。
投稿者 : 15:48 | コメント (0) | トラックバック (0)
トラックバック
このエントリーのトラックバックURL:
http://totora.jpn.org/mt/mt-tb.cgi/55