テーブルの表示位置について教えて下さい

しんり [HomePage] 2000/02/24(木) 12:30:20
以下のタグにて、テキスト文字の下にテーブルを表示させようとしたら、
ドッカーン！と隙間が空いてしまいます。
どうすれば「私の給与明細」の真下に表示できるのか、何卒ご指南頂け
ます様、お願い申し上げます。

<font size=5>私の給与明細</font>
<TABLE BORDER=3 cols=9 VSPACE=0>
         <CAPTION>収　入</CAPTION>
         <TR>
          <th><BR></TH>
</TH>
         </tr>
　　　　　　<th>項目</th>
           <td>基本</td>
　　　　　　<td>役職</td>
           <td>資格</td>
           <td>扶養</td>
           <td>住宅</td>
           <td>食事</td>
           <td>残業</td>
           <td><font size=1>財形補助</font></td>
           </TR>
</TABLE>

ＥＭＩ 2000/02/24(木) 12:46:58
回答ではないですが、いくつかつっこみ。
・cols属性って何ですか？
・左端にある</TH>が浮いています。
・</tr>の後に<tr>が抜けています。

やっちゃん 2000/02/24(木) 13:01:29
<font size=5>私の給与明細</font><br>
<TABLE BORDER=3 WIDTH=630>
<TR WIDTH=700 NOWRAP><TH>収入</TH></TR>
<TR>
<TH>項目</TH>
<td>基本</td>
<td>役職</td>
<td>資格</td>
<td>扶養</td>
<td>住宅</td>
<td>食事</td>
<td>残業</td>
<td><font size=1>財形補助</font></td>
</TR>
</TABLE>

一応試してみました。
EMIさんのおっしゃった通り、ちょっとHTMLのタグがおかしいですよね。（数もあってないです）

・<TABLE>タグでCOLS属性は見たことがありません。
おそらく幅や高さの調整をされたいのだと思いますので、
そういった場合にはWIDTHやHEIGHTを使うとよいかと思います。

やっちゃん 2000/02/24(木) 13:06:33
あ、私のもちょっとおかしいです。訂正。

＞<TR WIDTH=700 NOWRAP><TH>収入</TH></TR>

<TR><TH>収入</TH></TR>

収入をテーブルの外に出したい場合は、
上記一行を削除の後、<TABLE>タグの外側に書くのが
いいのかな、と思います。

びぎな++ 2000/02/24(木) 18:18:12
<TABLE BORDER=3 WIDTH=630　COLS=9>
<CAPTION><font size=5>私の給与明細</font></CAPTION>
<TR>
　<TH>収入</TH>
　<TD COLSPAN=8><BR></TD>
</TR>
</TR>
　<TH>項目</TH>
　<td>基本</td>
　<td>役職</td>
　<td>資格</td>
　<td>扶養</td>
　<td>住宅</td>
　<td>食事</td>
　<td>残業</td>
　<td><font size=1>財形補助</font></td>
</TR>
</TABLE>
表（テーブル）のタイトルを「私の給与明細」にするのであれば，
HTML的にはtableタグ内の<caption>で定義します。
COLSは列数を指定します。（実は今さっき知った(^^; ）

ＥＭＩ 2000/02/24(木) 18:30:36
HTML4.0的にはこんな感じ。（一部の属性などを省いてます）

<TABLE>
<CAPTION>私の給与明細</CAPTION>
<COLGROUP><COL SPAN="9"></COLGROUP>
<THEAD>
  <TR>
  　<TH>収入</TH>
  　<TD COLSPAN=8><BR></TD>
  </TR>
</THEAD>
<TBODY>
  <TR>
　  <TH>項目</TH>
　  <td>基本</td>
　  <td>役職</td>
　  <td>資格</td>
　  <td>扶養</td>
　  <td>住宅</td>
　  <td>食事</td>
　  <td>残業</td>
　  <td>財形補助</td>
  </TR>
</TBODY>
</TABLE>

しんり [HomePage] 2000/02/25(金) 10:24:17
皆様お忙しい中暖かいご指導ありがとうございます！（涙々）
大変申し訳ないのですが、私の質問の仕方が不十分だったのだと思います。
教えて頂きたかったのは、テーブルを、「ページのどこへ表示するか」という点です。
私のＨＰを見て頂ければ分かるのですが、「私の給与明細」という言葉に続けて
タグを組んだにも関わらず、その下にドッカーンと空白が空いてしまうのです！
どうかひとつ、どなたかお助けを・・・

ちなみに始めのタグがおかしいのは、金額を慌てて削除した、その余波であると思われます(笑)。
中途半端になってすみませんでした。

無責任官庁 2000/02/25(金) 10:38:33
>タグを組んだにも関わらず、その下にドッカーンと空白が空いてしまうのです！

それは皆さんが提示しているような修正をすれば、治りますよと。
要するに空白があく理由ってのが、ＨＴＭＬの文法違反であると。
そういうことです。
ちゃんと書けば、ちゃんと指定した場所に表示しますよ。

しんり 2000/02/25(金) 12:46:29
だから違うんです～っ
またも言葉足らずだったと反省しているのですが、そうじゃなくて、やっちゃんさんに
ご提案頂いたように、<TABLE>の外(正しくは上)にある文字（それが「私の給与…」）、
を用意したら、テーブルが大きく離れて表示されてるんです！
文法違反はしてないと思います。そのテーブル自体は、キチンと表示されて
いるのですから。
お恥ずかしいですが、宜しかったらＨＰ覗いて見て下さい。現象が一目で判ります。

B-Cus 2000/02/25(金) 12:54:17
全角空白でインデント付けてるから。

B-Cus 2000/02/25(金) 13:03:46
> 宜しかったらＨＰ覗いて見て下さい。現象が一目で判ります。
あと、問題のページに直接飛べるようにしてね。
回答者にわざわざ探させるようなことをしないで下さい。

無責任官庁 2000/02/25(金) 13:37:56
要するに、やってることはこういう事ですね。

<html>
<body>
あ<table border=1>い<tr>う<td>え</td>お</tr>か</table>
</body>

↑これをＨＴＭＬファイルにして表示してもらうと分かります。
この中では“え”だけが文法的に正しいので、テーブルの中に表示されると。
それ以外の文字は、なんでかテーブルの外にはじかれると。

ちなみにＩＥではタテにはじかれますけども、
ネスケでヨコにはじかれるようです。
（だからドカーンじゃなくて１行だけしか間隔があかない）

しんり [HomePage] 2000/02/25(金) 14:47:15
B-cusさん、回り道させて申し訳ありませんでした。実は直で飛べるアドレス知らなくて…(調べました！)
でインデント？「実際」には付けた覚えないのですが・・・。
それと無責任官庁様、何度もありがとうございます。でもちょっと違う…？
官庁さまの例文だと、テーブルの上にキチンと(笑)はじかれていますが、私のはネスケであるにも関わらず、
「上」にドカーン！　無論ＩＥ５．０でも確認しましたがやはりドカーン(笑)。

本件再度、コミュニティの管理者に確認してみたいと思います。
またコメントをご報告致します。皆様ありがとうございました。

ＥＭＩ 2000/02/25(金) 15:18:29
文法がかなり怪しいので、添削してみました。
こんな感じ。
<BLOCKQUOTE>
<BR>
<FONT SIZE=5>家族構成</FONT><BR>
夫１人(笑)・子供１人（1.5歳）、母別居<BR>
<BR>
<FONT SIZE=5>現在の借金</FONT><BR>
土地　４６０万円　＆　住宅金融公庫　２０００万円…　だったかな？<BR>
<BR>
<FONT SIZE=5>私の給与明細</FONT><BR>
<TABLE BORDER WDTH=630>
<CAPTION><FONT SIZE=5>手取り＝２１</FONT></CAPTION>
<TR><TH COLSPAN=10>収入</TH></TR>
<TR><TH>項目</TH><TD>基本</TD><TD>役職</TD><TD>資格</TD><TD>扶養</TD><TD>住宅</TD><TD>食事</TD><TD>残業</TD><TD><FONT SIZE=1>財形補助</FONT></TD><TH>合計</TH></TR>
<TR><TH>金額</TH><TD>222900</TD><TD>7000</TD><TD>3000</TD><TD>20000</TD><TD>15500</TD><TD>9000</TD><TD>10744</TD><TD>1000</TD><TD><STRONG>289144</STRONG></TD></TR>
<TR><TH COLSPAN=10>天引</TH></TR>
<TR><TH>項目</TH><TD>健康保険</TD><TD>所得税</TD><TD>厚生年金</TD><TD>組合費</TD><TD></TD><TD></TD><TD>団体保険</TD><TD>財形</TD><TH>合計</TH></TR>
</TABLE>
</BLOCKQUOTE>
これでどうだろう？
BLOCKQUOTEの中にBODYがあったり、テーブルの中の変なところにBR要素があったりして非常に怪しかったので、全部削除しました。
後、見ればわかると思いますがTITLE属性はマークアップできません。
<TITLE><font color=red>しんり</font>の赤裸々なプロフィール</TITLE>
は、間違いです。
後、タグの大文字小文字はできるだけ統一しましょう。(^^;

＞実は直で飛べるアドレス知らなくて…(調べました！)
何でですか？自分のサイトでは？

B-Cus 2000/02/25(金) 15:26:58
> でもちょっと違う…？
<TR><TH>項目</TH>　<TD>基本</TD>　<TD>役職</TD>
こういう感じで全角空白が入ってます。

> ちなみにＩＥではタテにはじかれますけども、
> ネスケでヨコにはじかれるようです。
これは逆じゃないですかね。NN/NC だとドカーンのはず。

無責任官庁 2000/02/25(金) 16:35:35
> これは逆じゃないですかね。NN/NC だとドカーンのはず。
うーむ…ブラウザやＯＳによって異なるようですねぇ。
私のテスト環境、IE4.01sp2(Win)ではタテに、
NN4.04en(Win),NC4.7ja(Win)では横にはじいてますねぇ。

＃HotJava3 は、はじかずに無理矢理テーブル作ってくれるし（笑）

>でもちょっと違う…？
言葉が足りず、すみません。
あれは単に、<TD>基本</TD>なんか<TD>役職</TD>っていう風に、
変な書き方をするとテーブルの外に出されてしまいますっていう
ことを言いたかっただけなので…
ですから、B-Cusさんの言うように全角の空白がそこにあると、
テーブルの上に空白行が強制的に作られてしまいますよ～と。

しんり 2000/02/25(金) 16:53:24
うわ～　添削までして頂いて…本当に恐縮です、ありがとうございます。
実は私のページは、私を含めたド素人ご用達の、フォームをワープロ感覚で埋めていくだけの
「５分で出来る(笑)！無料ホームページ」なのです。妙にチグハグしているのはその為です(笑)。
皆様のご好意に報いる様、週末じっくり腰を据えて勉強し、月曜には「解」の字を入れたいと…
頑張りまっす！(こぶし)

B-Cus 2000/02/25(金) 18:26:23
> うーむ…ブラウザやＯＳによって異なるようですねぇ。
さいですか。全てのNN/NCで同じ動作をするものだと思い込んでました。
FreeBSD+NN4.6 では「私の給与明細」と「手取り＝２１」の間に
数十行空いてます。

# http://sc.gaiax.com/user/sc/m/n/money3_master/profile.html
# このページですよね?

Syn [E-Mail] 2000/02/25(金) 18:42:21
Windows 2000 で、 IE5.01 ／ NN4.7 ともに「私の給与明細」の下
にドカーンと空行ができてます。

無責任官庁 2000/02/25(金) 23:55:42
> さいですか。全てのNN/NCで同じ動作をするものだと思い込んでました。

え～と。隙間に入ってるのが空白だけなら、ヨコにはじかれるんですけど、
例のソースを拝見すると、
<TH>項目</TH><BR>　 <TD>基本</TD>
のように、<BR>タグまで入ってまして、それがはじかれた結果、
ドカーンとなってるワケですね。

ド 2000/02/26(土) 00:29:53
カーン（笑）

B-Cus 2000/02/26(土) 05:15:53
> <BR>タグまで入ってまして
あ、そうですね。アレを見るとどのブラウザでも
上に空白ができるということですね。

FreeBSD+NN4.6 で
　http://X68000.startshop.co.jp/~68user/tmp/wrong-table.html
を見ると、
　XY XY XY
　 a  a
　 b  b
　 c  c
と、上に押し出されます。

茶具 [HomePage] 2000/02/26(土) 06:05:15
問題になっているのは gaiax 系の特殊な HTML 記述法ですね。
gaiax サーバへの登録内容で改行をしますと、自動的に <BR> に置き換えられてしまうのです。
また、<TABLE> 内の妙な場所 (</TD>ここ<TD> など) に置かれたものは、
多くのブラウザでは <TABLE> の前や後ろに表示するようです。
ですから結果的に <TABLE> の前に <BR> が十数個並んでいるのと同じ事になります。

お手軽ホームページは HTML を使おうとすると、普通にテキストエディタで HTML
を書いてジオなどにアップロードすることの何十倍も面倒なんです。

と、グチをこぼしてもしょうがないので [HomePage] のソースを
参考にしていただければと思いますが、テキストエディタで原稿を
書いて、改行を一気に取り去ったものを使用しています。

＃HTMLソースのコメント増量キャンペーン中なので、編集ページのどこに何を
＃書き込んでいるかは比較的わかりやすいと思います。

で、テーブルは、

<TABLE><TR><TD>～</TD><TD>～</TD><TD>～</TD></TR><TR><TD>～</TD><TD>～</TD><TD>～</TD></TR></TABLE>

と記述してください。もし、<TD>～</TD> の中で <BR> を入れたい箇所があれば
そこで改行することができます。なんにせよ見やすいソースを書いては
いけないのです、gaiax 系では。
------
ついでなので書きますが、「,」「"」などの文字は削除されます。
(ページデータの保持の際に区切りなどに使用しているものと思われます)
例えば <FONT face="AAA,BBB"> は <FONT face=AAABBB> と、全く別物に
なってしまいますので要注意。

ちなみに JavaScript は上記の複合技でさらに壮絶なことになります(泣/笑)。

しんり [HomePage] 2000/02/28(月) 11:26:41
[[解決]]
皆様この度は暖かいご指導を、本当にありがとうございました。
お陰様で「ドッカーン！」の空白が無くなりました…（多謝多謝）。
原因は、でたらめな文法（恥…）ではなく、スペースを借りている所が
「gaiax(ガイアックス)系」であったという事でした。(最初にその点を
申し上げるべきであったと反省しております)
茶具さまのおっしゃる通り、勝手に<BR>が挿入されてしまった結果で、
アドバイス頂いた通り全てのタグを続けて入力すると、キチンと表示さ
れました。
今回の件で、世間さまの暖かみをしみじみ噛み締めた次第です。
皆様本当にありがとうございました。

[上に] [前に] [次に]