dポイントプレゼントキャンペーン実施中!

一覧表を作り、その内部では改行が行われないようにしたいのですが、
スタイルシートでnowrapを指定(tdやdivなどで)しても、ウィンドウのサイズを変更すると
自動改行が行われてしまいます。
テーブルの幅を85%にし、センター指定していて、ウィンドウが小さくなったときに
できればそちらを先に無視して欲しいのですが、無理なのでしょうか。
競合しないタグでの優先順位について調べてみたのですが、分かりませんでした;
ブラウザの解釈なのでしょうか?ちなみに、確認しているブラウザはIE6です。

初めは
│ ̄│ ̄ ̄ ̄│ ̄│ ̄ ̄ ̄│
│ ̄│ ̄ ̄ ̄│ ̄│ ̄ ̄ ̄│
│ ̄│ ̄ ̄ ̄│ ̄│ ̄ ̄ ̄│
  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
の様に、セル二個組からなる表を、半分横に並べようかと思っていたのですが
(表の順序で考えるとおかしいですが;)
縦一列にすれば、よっぽどウィンドウサイズを小さくしない限り自動改行が入ることはなくなるので
どうしても無理であれば、そうしようかとも思っています。ただ、根本的な解決にはなっていないので・・・。
理由が分かる方、どうか教えていただけないでしょうか。

A 回答 (2件)

これをやると改行されませんよ。


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>copy</TITLE>
<style type="text/css">
table{width:80%;margin:auto}
#aa{white-space: nowrap;}
#bb{white-space: nowrap;}
#cc{white-space: nowrap;}
</style>
</HEAD>
<BODY>
<table>
<tr><td id="aa">ああああああああああ</td><td>ああああああああああ</td></tr>
</table>
<table>
<tr><td>ああああああああああ</td><td><div id="bb">ああああああああああ</div></td></tr>
</table>
<table>
<tr><td><span id="cc">ああああああああああ</span></td><td>ああああああああああ</td></tr>
</table>
</BODY>
<HTML>

IE6とFirefoxです。

この回答への補足

ご回答ありがとうございます。
早速試してみたのですが、自動改行されなくなりました!!
ただ、TDで指定している所だけはウィンドウサイズを変更すると
やはり改行されてしまうのですが・・・どこか間違っているのでしょうか;下にソース(一部省略)を書いておきます。もしよければ見て頂けると助かります。
実際は別のスタイルシートで、目立つようにもう少し文字を大きく指定しています。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" type="text/css" href="../style.css">
<style type="text/css">
table{width:85%;margin:auto}
#a{white-space: nowrap;}
#b{white-space: nowrap;}
#c{white-space: nowrap;}
#d{white-space: nowrap;}
</style>
<title>通信10月号</title>
</head>

<body>
<table align="center"><tr><td>

<table border="1" width="100%">
<caption><font size="4"><b>年間担当表</b></font></caption>
<tr><td id="a" width="100" align="center">10月</span></td>
<td width="300" align="left"><div id="b">全体チェック(年度始め)</div></td>
<td width="100" align="center"><span id="c">4月</span></td>
<td width="300" align="left"><p id="d">全体チェック(年度始め)</p></td>
</tr>
<tr><td width="100" align="center">11月</td>
<td width="300" align="left">山田太郎・田中花</td>
<td width="100" align="center">5月</td>
<td width="300" align="left">山田太郎・田中花</td>
</tr>
<tr><td width="100" align="center">12月</td>
<td width="300" align="left">山田太郎・田中花</td>
<td width="100" align="center">6月</td>
<td width="300" align="left">山田太郎・田中花</td>
</tr>
</table></div>

</td></tr></table>
<hr>
</body>
</html>

HTMLを勉強し始めてまだ間がなく、他にもおかしい所が多々あるかもしれません。
気になった点があれば、アドバイス頂けると嬉しいです。よろしくお願いします。

補足日時:2006/11/02 10:46
    • good
    • 0
この回答へのお礼

補足を書かせていただいた後、色々触っていたらうまくいきました。
教えていただいたソースから、4種のidを2種のclassに変更して
divでクラス指定すると大丈夫でした。

質問する前に自分で試していたときにも、idを使ってtdやspanに
nowrapの指定をしてみた気がするのですが・・・なぜうまくいかなかったのか(・_・;
DOCTYPEの違いなんでしょうか?可能性としてはそれが高そうですが。とにかく大変助かりました。
本当にありがとうございました。

お礼日時:2006/11/02 12:42

セルの横幅の指定は、<COL>要素を使用して


作成例
<COL span="1" STYLE="width:305px;">
ピクセル(画面上の1ピクセルを意味する)
文字の大きさもピクセル指定しないと作成画面の大きさにより自動改行が入りますよ
Tukimiyamaさんのように改行場所等を気にする場合、ピクセルも検討してみて下さい
font size="4" 17インチ→18pxです
    • good
    • 0
この回答へのお礼

回答、どうもありがとうございます。
THMLの方でも、CSSでもTDのwidthを指定したのですがうまくいかず、
悩んでいたのですが、<col>要素を使うのは知りませんでした。
文字の大きさも指定しないと、自動改行されるのですね。
よく分かりました。そちらの方法も考えてみます。
フォントの例までつけて頂き、とても考えやすいです。
ありがとうございました。

お礼日時:2006/11/02 11:58

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!