- ベストアンサー
HTMLの表で幅を指定しても折り返すことは無理なのでしょうか？
以下のHTMLの表は横幅を指定していますが、 すごく横長な表になってしまいます。セルの幅を指定してもセル内の文字を折り返す事は不可能なのでしょうか？ <html> <head> <title>table</title> </head> <body> <table width="570" border="1"> <tr><td width="130"> test1</td> <td bgcolor="#CCCCCC" width="440"> oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo </td></tr></table> </body> </html>
- みんなの回答 （5）
- 専門家の回答
質問者が選んだベストアンサー
私も悩みました。（という意味で経験者） お書きのソースでは、<td>内に英数字がスペースなしで並んでいますね。 これを「途中で改行できない単語」と認識するのだと想像してます。 質問欄も、gooから拝見しますと、<table width="100%"><tr><td width="80%"> のソースにも関わらず、表示はウインドウの外にはみだしています。 ところどころに<wbr>を挿入したら改行してくれないでしょうか？ cgiとかで受取るなら、連続する１バイト文字を数えて<wbr>を挿入 してから、<td>内に書き出すとか。 ＵＲＬのように、途中を区切れないなら、 <a href="ooooooooooooooooooooooooooooooooooooooooooo">ooooooo...</a> のように表示分を短縮するとか。（このサイトの「参考ＵＲＬ」のように）
その他の回答 (4)
スタイルシートで出来ますよ。（ただしInternet Explorer のみ？＾＾；） <TD>タグの中に、「style="word-break:break-all;"」を追加してみてください。 要するに、こういう↓感じです。＾＾ ブラウザ（Internet Explorer ）で表示させてみてね。 <html> <head> <title>table</title> </head> <body> <table width="570" border="1"> <tr><td width="130"> test1</td> <td bgcolor="#CCCCCC" width="440" style="word-break:break-all;"> oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo </td></tr></table> </body> </html>
- train13
- ベストアンサー率30% (8/26)
半角英字では１つの単語とみなされるからか 強制改行になりませんが 日本語でしたらきちんと改行されますよ。
- MtHill
- ベストアンサー率68% (17/25)
Internet Explorer なら、スタイルシートで半角文字を強制改行させることができます。 詳細は過去ログ http://www.okweb.ne.jp/kotaeru.php3?q=212651 (No.2) をご覧ください。
- Magician
- ベストアンサー率35% (63/176)
自信ないですが、％にしてみてはいかがでしょうか。 変更点は 100% 25% 75% だけにしてあります。 うまくいかなかったら、ごめんなさい。 無視してください。 <html> <head> <title>table</title> </head> <body> <table width="100%" border="1"> <tr><td width="25%"> test1</td> <td bgcolor="#CCCCCC" width="75%"> oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo </td></tr></table> </body> </html>
