• ベストアンサー

半角だけだとtableタグのwidth指定が無効になってしまう。

半角だけだとtableタグのwidth指定が無効になってしまいます。半角を入力した際にwidth指定を有効にする方法をご教授お願いします。 <TABLE border="1" width="110"> <TBODY> <TR width="110"> <TD width="110">0123456789012345678901234567890123456789</TD> </TR> </TBODY> </TABLE> <BR> <TABLE border="1" width="110"> <TBODY> <TR width="110"> <TD width="110">0123456789012345678901234567890123456789012345678901234567890</TD> </TR> </TBODY> </TABLE>

  • HTML
  • 回答数2
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
  • ryk1234
  • ベストアンサー率40% (46/113)
回答No.1

>半角だけだと 単語の切れ目がないと改行しないみたいですね… TextAreaに入れるしか思い浮かびません。 補足: ご提示のサンプルIEでは全角時改行されますが FireFoxだと改行されませんでした。

meikenpochi
質問者

お礼

回答ありがとうございます。 >FireFoxだと改行されませんでした。 ブラウザによっても違ってしまうんですね。 TextAreaに入れる方法だと↓の様な感じですかね。 <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <STYLE> <!-- TEXTAREA { scrollbar-base-color: #ffffff; scrollbar-arrow-color: #ffffff; scrollbar-face-color: #ffffff; scrollbar-highlight-color: #ffffff; scrollbar-shadow-color: #ffffff; scrollbar-darkshadow-color: #ffffff; } --> </STYLE> </HEAD> <BODY> <TEXTAREA rows="5" cols="20" style="border=0;">012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789</TEXTAREA> </BODY> </HTML>

meikenpochi
質問者

補足

Macではどうなるのでしょうか? Mac使ってる方いたら、教えてもらえませんか?

その他の回答 (1)

  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.2

似たような質問(参考URL)があったので参考になれば。 ただ、tdに直接スタイルを指定してもうまくいかなかったかも(その時はtdの中にdiv等をおけばよかったかも)

参考URL:
http://oshiete1.goo.ne.jp/kotaeru.php3?q=1200492
meikenpochi
質問者

お礼

回答ありがとうございます。 自己解決できました。 <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <STYLE type="text/css"> <!-- td.test {width:150px; word-wrap: break-word;} --> </STYLE> </HEAD> <BODY> <TABLE border="1"> <TBODY> <TR> <TD width="150">0123456789012345678901234567890123456789</TD> </TR> </TBODY> </TABLE> <BR> <TABLE border="1"> <TBODY> <TR> <TD class="test">0123456789012345678901234567890123456789012345678901234567890</TD> </TR> </TBODY> </TABLE> </BODY> </HTML>

関連するQ&A

  • テーブルサイズ指定

    こんにちは。 困ったことがあるのですが、 <TABLE BORDER="1"CELLSPACING=1 CELLPADDING=1 BGCOLOR="#FFFFFF"> <TBODY> <TR> <TD width=170文字</TD> <TD width=638>文字</TD></TR> <TR> <TD>文字</FONT></TD> <TD>文字</TD></TR> </TR></TBODY></TABLE> <BR> <TABLE BORDER="1"CELLSPACING=1 CELLPADDING=1 BGCOLOR="#FFFFFF"> <TBODY> <TR> <TD width=170>文字</FONT></TD> <TD width=638>文字</TD></TR> <TR> <TD>文字</FONT></TD> <TD>文字</TD></TR> </TBODY></TABLE> (それぞれの文字の長さは違います。) という2つのテーブルで、 2つともテーブルの幅が異なるんです。 これを、両方とも同じ幅にすることはできないでしょうか? 宜しくお願いします。

    • ベストアンサー
    • HTML
  • テーブルの行の高さを指定する時全てのtdタグに?

    スタイルシートでテーブルの行の高さを指定する時は、 全てのtdタグにスタイルシートを指定するべきか、 1つだけ(一番左だけ)指定すればいいのかわからないので押してください。 全てのtdタグに指定しても、一つのtdタグに指定しても、結局はその行の高さは指定した高さになります。 コードを書く上でどちらが適切か教えてください。 -------------------------------------------------- <style type="text/css"> td.test {height: 50px;} </style> <body> 1の例<br>(2列ともclass="test"を入れた)<br> <table border=1> <tr><td class="test">1</td><td class="test">2</td></tr> <tr><td class="test">3</td><td class="test">4</td></tr> </table> <br><br> 2の例<br>(一番左の列だけclass="test"をいれた)<br> <table border=1> <tr><td class="test">1</td><td>2</td></tr> <tr><td class="test">3</td><td>4</td></tr> </table> <br><br> 3の例<br>(スタイルシートは何も指定していない)<br> <table border=1> <tr><td>1</td><td>2</td></tr> <tr><td>3</td><td>4</td></tr> </table>

    • ベストアンサー
    • HTML
  • tableタグとtableタグの間の余白の消し方について

    現在モバイル用のHPを作成しているのですが、 AUで見た際に、tableタグとtableタグの隙間(空白)が出来てしまいます。 tableタグ1個でまとめればどうってことのない問題なのですが、 デザイン上、どうしてもtableタグを分ける必要があるります。 ■以下ソースです。 ************************************* <html> <head> <meta http-equiv="Cache-Control" content="no-cache" /> <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS" /> <title>タイトル</title> </head> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="2"> <center> <a href=""><img src="gazou.gif" width="151" height="42" /></center> </td> </tr> </table> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="2" bgcolor="#FFFFCC"> <center> <a href=""><img src="gazou.gif" width="151" height="42" /></center> ・ ・ ・ ************************************* ↑の… </table>      ←この部分に余白ができます。 <table width="100%" border="0" cellpadding="0" cellspacing="0"> どなたか原因と解決法をご教示いただけませんでしょうか。 宜しくお願いいたします。

    • ベストアンサー
    • HTML
  • テーブル高さ指定タグについて

    テーブル高さ指定タグについて サイズがバラバラの4枚の画像をテーブルを使って同じ幅・高さ縦横各2枚並べて表示したいと思っています。 下記のとおり高さ・幅300と指定をしているにもかかわらず、400×400pixの画像が高さを超えて目いっぱい表示してしまいます。 <table border="1" width="600" height="600" cellspacing="0" cellpadding="0"> <tr> <td width="300" height="300" align="center"> <IMG border="0" src="http://○○○○/f000000_1.jpg"></td> <td width="300" height="300" align="center"> <IMG border="0" src="http://○○○○/f000000_2.jpg"></td> </tr> <tr> <td width="300" height="300" align="center"> <IMG border="0" src="http://○○○○/f000000_3.jpg"></td> <td width="300" height="300" align="center"> <IMG border="0" src="http://○○○○/f000000_4.jpg"></td> </tr> </table> どうすれば、すべて300×300pixの範囲内におさめることができるのでしょうか?

    • ベストアンサー
    • HTML
  • ScriptがTABLEタグの中に表示されません。

    下記の様にScriptを使ってTABLEタグの中に表示させようと思ったのですが、test2.jsの「あれ?」がTABLEタグ欄に表示されません。 何方かご教授してもらえませんか? ↓↓↓↓<HTML File>↓↓↓↓ <HTML><BODY> <script src="./test1.js"></script> </BODY></HTML> ↓↓↓↓<test1.js File>↓↓↓↓ document.open(); document.write("<TABLE border=1><TBODY><TR><TD>1</TD><TD>おや?<script src=\"./test2.js\"></script></TD></TR><TR><TD>1</TD><TD>1</TD></TR></TBODY></TABLE>"); document.close(); ↓↓↓↓<test2.js File>↓↓↓↓ document.open(); document.write("あれ?"); document.close();

  • 画像配列のタグが分かりません

    以前に質問して解決しなかった為、再投稿しました 現在FC2ブログを運営して、2ヶ月が経過したと思いますが ブログの中で、画像と解説を上下に並べたく そのタグの方法で質問です それと、タグを入れた事で文章が長くなりました 申し訳ありません 尚、予め説明しておくと“--”の部分に関しては 内容の説明と、どう反映させたいかを 分かり易く…と思い、分けただけなんで 並べ方としては、この方法なんですが ----------------------------- ----------------------------- 画像 解説 画像 解説 画像 解説 画像 解説 画像 解説 画像 解説 画像 解説 画像 解説 ----------------------------- ----------------------------- 要するに、画像の隣に解説を置き 更に、間を、ほとんど(?)開かせずに 改行して、同じ様に画像の隣に解説… そう設置したいんです それで、今迄、私が設定した方法では この並びだったんですが ----------------------------- ----------------------------- 画像 解説 画像 解説 ----------------------------- ----------------------------- この設置方法で、タグとしては ここで教えて貰った方法で ----------------------------- <table border=0> <tr> <td>画像</td><td>解説</td> <td>画像</td><td>解説</td> </tr> </table> ----------------------------- でしたし、解説が2段以上の時には ----------------------------- <table border=0> <tr> <td>画像</td><td>解説1<br>解説2</td> <td>画像</td><td>解説3<br>解説4</td> </tr> </table> ----------------------------- でした 要するに、今迄は、画像の隣に解説…で設置しても 改行は、した事が、ありません そこで、ここでも質問した所 下記の種類のタグを教えて頂きました ---------------------------- <table border=0 cellpadding=0 cellspacing=0 width=600> <tr> <td colspan=4>タイトル</td> </tr> <tr> <td width=200>画像</td><td width=100>解説1<br>解説2</td> <td width=200>画像</td><td width=100>解説3<br>解説4</td> </tr> <tr> <td width=200>画像</td><td width=100>解説1<br>解説2</td> <td width=200>画像</td><td width=100>解説3<br>解説4</td> </tr> </table> ------------------------------ タイトル <table border=0> <tr> <td>画像</td><td>解説1<br>解説2</td> <td>画像</td><td>解説3<br>解説4</td> </tr><tr> <td>画像</td><td>解説1<br>解説2</td> <td>画像</td><td>解説3<br>解説4</td> </tr> </table> ------------------------------ <table> <caption>タイトル</caption> <tr> <td>画像</td><td>解説1<br>解説2</td> <td>画像</td><td>解説3<br>解説4</td> </tr><tr> <td>画像</td><td>解説1<br>解説2</td> <td>画像</td><td>解説3<br>解説4</td> </tr> </table> ----------------------------------- しかし、いずれも タイトルと画像や、タイトルと上に 大きくスペースが開いてしまいます これは、どう設置したら良いんでしょうか?

  • tableタグについて

    <table width="700" border="0"> <tr><td width="700">あああああああ</td></tr> <tr><td width="200">いい</td><td width="500">ううううう</td></tr> </table> このタグですと【ああああああ】の部分が2段になります。 多分<td width="200">のためやと思うのですが、 <tr><td width="200">いい</td><td width="500">ううううう</td></tr> の部分を <tr><td width="700"><table width="700"><tr><td width="200">いい</td><td width="500">ううううう</td></tr></table></td></tr> にすると表示されます。 この方法以外にもっと簡単に表示できる方法はないでしょうか お願いします。

    • ベストアンサー
    • HTML
  • ASP修正について

    下記のソースを書いています。 印刷ボタンと閉じるボタンがうまく表示されない。ボタンクリック表示されない。 不要なところは削除してもかまいません。 教えてください。 sResult = sResult & _ " </TR></TBODY></TABLE><BR>" & _ "<TABLE border=^0^><TBODY>" & _ " <TR>" & _ " <TD width=^354^><FONT size=^-1^ color=^#0099ff^></FONT></TD>" & _ " </TR><TR>" & _ " <TD><FONT size=^-1^>" & _ "  " & _ "  " & _ "  " & _ "  " & _ "  " & _ "  </FONT></TD>" & _ " </TR>" & _ "</TBODY></TABLE>" & _ "<input type=^button^ value=^印 刷^ onclick=^window.print()^>  <input type=^button^ value=^とじる^ onclick=^link()^>" & _ "<BR><BR><TABLE border=^0^ align=^center^><TBODY>" & _ " <TR><TD align=^center^>" & _ " <br><B>処理が完了しました。ご依頼ありがとうございます。<BR>" & _ " [印刷] ボタンをクリックすると、このページの内容をプリントアウトできます。<BR>" & _ " [印刷] ボタンが表示されない場合は、ブラウザの印刷機能をご利用ください。</B>" & _ " </TD></TR>" & _ "</TBODY></TABLE>" & _ "<BR></CENTER>" & _ "<TABLE border=^0^><TBODY>" & _ " <TR><TD><FONT size=^-1^>" & _ " " & _ " </FONT></TD>" & _ " </TR>" & _ "</TBODY></TABLE>" & _ "<BR></FONT>" & _ "<TABLE border=^0^ width=^660^ cellpadding=^1^ align=^center^><TBODY>" & _ " <TR><TD width=^911^ align=^center^>" & _ " <A href=^^>" & _ " <IMG src=^img/index.gif^ alt=^indexページへ^ border=^0^ height=^20^ width=^80^ align=^center^></A>" & _ " </TD></TR>" & _ "</TBODY></TABLE>" & _ "</FORM></BODY>" & _ "</L>"

  • Dreamweaverのデザインで表示がおかしい時

    IEだと綺麗に表示されるけど、Dreamweaverのデザインで見ると表示がおかしい時って結構あり困ってます。 ソースフォーマットとかやってもやはり駄目です。 今回の場合、どのタグが悪そうでしょうか? <HTML> <HEAD> <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=EUC-JP"> </HEAD> <BODY> <BR> <BR> <BR> <TABLE align="center" cellSpacing=0 cellPadding=0 width="95%" bgColor=#0066cc border=0> <TBODY><TR><TD> <TABLE cellSpacing=2 cellPadding=1 width="100%" border=0> <TBODY> <TR bgColor=#0066cc> <TD align=middle><SMALL><B><FONT color=#ffffff> テキストツール </FONT></A></B></SMALL>&nbsp; </TD></TR> <TR bgColor=#ffffff> <TD align=middle> <TABLE height="400" cellSpacing=0 cellPadding=1 width="95%" border=0> <TBODY> <TR valign=top> <TD width="100%" valign="center" align="center"> <BR><A>トップページ</A><BR><BR> </TD> </TR> <TR valign=top> <TD width="100%" valign="top" align="center"> <A HREF="list">あ</A><BR><BR> <A HREF="clist">い</A><BR><BR> <A HREF="slist">う</A><BR><BR> </TD> </TR> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </BODY></HTML>

  • widthの% or ピクセルを指定した場合の違いについて

    お世話になっております。 下記のソースは、2つのテーブルをくっつけたソースなのですが、 (1)はwidthに「%」を指定しており、(2)は「ピクセル」を指定しています。 (1)の%だとちょうど合っていますが、(2)のピクセルを指定した場合では、値を合わせているにも関わらずずれてしまっています。 「ピクセル」指定をした場合でも合わせるにはどうすればよいのでしょうか? (1)widthに「%」を指定 </head> <body> <div style="width:330;height:20;overflow:hidden"> <table cellpadding="0" width="300" border="1" align="left"> <tr> <td width="20%">列1</td> <td width="20%">列2</td> <td width="20%">列3</td> <td width="20%">列4</td> <td width="20%">列5</td> </table> </div> <div style="width:330;height:50;overflow:auto"> <table cellpadding="0" width="300" border="1" align="left"> <tr> <td width="20%">ああああああああああああああああああああああ</td> <td width="20%">2</td> <td width="20%">3</td> <td width="20%">4</td> <td width="20%">5</td> </tr><tr> <td>4</td> <td>5</td> <td>6</td> <td>7</td> <td>8</td> </tr><tr> <td>7</td> <td>8</td> <td>いいいいいいいいいいいいいいいいいいいいいい</td> <td>10</td> <td>11</td> </tr> </table> </div> (2)widthに「ピクセル」を指定 </head> <body> <div style="width:330;height:20;overflow:hidden"> <table cellpadding="0" width="300" border="1" align="left"> <tr> <td width="60">列1</td> <td width="60">列2</td> <td width="60">列3</td> <td width="60">列4</td> <td width="60">列5</td> </table> </div> <div style="width:330;height:50;overflow:auto"> <table cellpadding="0" width="300" border="1" align="left"> <tr> <td width="60">ああああああああああああああああああああああ</td> <td width="60">2</td> <td width="60">3</td> <td width="60">4</td> <td width="60">5</td> </tr><tr> <td>4</td> <td>5</td> <td>6</td> <td>7</td> <td>8</td> </tr><tr> <td>7</td> <td>8</td> <td>いいいいいいいいいいいいいいいいいいいいいい</td> <td>10</td> <td>11</td> </tr> </table> </div>

    • ベストアンサー
    • HTML

専門家に質問してみよう