<table>

<td width="200">
<pre>hogehoge</pre>
</td>
</table>

のようにwidthで幅をしていしていても、preで囲まれた部分が広いと、それに従ってテーブルも広がってしまいます。
ちなみにpreを外すと指定した幅に収まるよう、自動的にテキストが改行されます。

preの中には改行コード等を入れるので、preは使いたいと思います。しかし、幅も固定しておきたいのですが、いい方法はないでしょうか。

回答の条件
  • 1人2回まで
  • 登録:2007/10/07 16:43:34
  • 終了:2007/10/07 23:03:33

回答(2件)

id:GoldenDawn No.1

GoldenDawn回答回数426ベストアンサー獲得回数812007/10/07 18:41:41

ポイント50pt

あんまりうまい手は思いつきませんが……

1) CGI や PHP で改行を <br /> に変換する

2) CSS と JavaScript を使う

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <style type="text/css">
      pre { word-wrap : break-word ; word-break : break-all ; } /* for IE */
    </style>

    <script type="text/javascript">
      onload = function() {
        if (navigator.appVersion.indexOf('MSIE') < 0) { // IE 以外
          var pres = document.getElementsByTagName('pre') ;
          for (var i = 0; i < pres.length; ++i) {
            pres[i].style.whiteSpace = 'normal' ;
            pres[i].innerHTML = pres[i].innerHTML.replace(/[\n]/g, '<br />') ;
          }
        }
      }
    </script>
  </head>

  <body>
    <table><td width=100><pre>
吾輩は猫である。



名前はまだ無い。
どこで生まれたか頓と見當がつかぬ。(Firefoxはここにスペースが必要→) </pre></td></table>
  </body>
</html>

ただ、こちらの方法ではなぜか Firefox だと </pre> の前にスペースがないと white-space に normal が適用されないようです。

id:tono5652

ありがとうございます。助かりました!

2007/10/07 23:02:24
id:wen000 No.2

wen000回答回数134ベストアンサー獲得回数82007/10/07 21:46:05

ポイント20pt

CSSで

word-break:break-all;

と指定してみては。

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません