HTMLテーブルについて質問です。幅500で、1行目の見出しの下は3列に分かれ、

一番右のC列は左頭揃えでテキストを流し込み自動改行で文字数によって高さが伸びて
いきます。IEや、ネスケでちゃんと表示されるのですが、ビルダーで開いたら、B列とC列の
間に空間が出来て、C列が細長い列になってしまいます。以下のソースでテーブルが崩れる
問題点などありましたら、ご指摘ください。
<table border=1 cellspacing=0 cellpadding=0 width=500>
<tr><td colspan=”3”>幅500見出し</td></tr>
<tr><td width=”30”>A幅30</td>
<td align=left width=”170”>B=幅170</td>
<td align=left width=”300”>C=幅300のテキストスペースになります。幅300のテキストスペースになります。</td></tr>
</table>

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:
  • 終了:--
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

回答9件)

id:MARYGUN No.1

回答回数65ベストアンサー獲得回数0

ポイント13pt

http://www.hatena.ne.jp/1080559305#

HTMLテーブルについて質問です。幅500で、1行目の見出しの下は3列に分かれ、 一番右のC列は左頭揃えでテキストを流し込み自動改行で文字数によって高さが伸びて いき.. - 人力検索はてな

>B列とC列の間に空間が出来て、C列が細長い列になってしまいます。

上記の状態がいまいち分かりませんが、

これでどうでしょうか?

<table border=1 cellspacing=0 cellpadding=0 width=500>

<tr><td colspan=”3”>幅500見出し</td></tr>

<tr><td width=”30”>A幅30</td>

<td align=left width=”170”>B=幅170</td>

<td align=left width=”300”>C=幅300のテキストスペースになります。幅300のテキストスペースになります。</td></tr>

</table>

”⇒”に変更しました。

id:cony

”⇒”

すみません。この記号の事でしたら、はてなに記載される時、自動変換されてしまう様です。

2004/03/29 20:43:14
id:vicden No.2

回答回数172ベストアンサー獲得回数0

ポイント25pt

URLはダミーです。

ビルダーを持たないので具体的ではありませんが、

IE、NN、Opera(いずれもWin版)、どれでみても正常に見え、言われるような表示はされません。

ですので、特に思い当たることはないのですが、私なら「colspan=3」の後に「width=500」を念のために入れておきます。(これが解決策とは限りませんが…。)

id:cony

ありがとうございまず。

念のため、「width=500」を入れてみる事にします。実は私自身もビルダーを持っていず、別の方の指摘(ただその方自体がHPに詳しくないので原因判らず)だったので、これで解決できるかは不明なので、質問を続行させていただきます。

上記の説明わかりずらくてすみません。

もし、実際ビルダーを使っていらっしゃる方で問題点など思い当たる事がありましたら、ご指摘ください。

2004/03/29 20:49:53
id:tom_brown No.3

回答回数259ベストアンサー獲得回数0

ポイント25pt

Aで30と指定し

Bで170と指定し

Cで300と指定して

テーブルの幅は特に指定しなければよいと思います。

<table border=1 cellspacing=0 cellpadding=0>

<tr>

<td colspan=3>見出し 幅 500</td>

</tr>

<tr>

<td width=30>A 幅 30</td>

<td width=170>B 幅 170</td>

<td width=300>C 幅 300 テキストスペース</td>

</tr>

</table>

id:cony

なる程。ソースとしては、どちらも間違っていないように思えるのですが(今まで、なるべく細かくサイズ設定した方がテーブルは崩れにくいと思っていたのですが。。^^;)

ドリームウエーバーやゴーライブでも表示確認OKだったので、崩れてしまう要因などもう少し詳しく教えていただけるとありがたいです。

2004/03/29 21:00:38
id:sakichin No.4

回答回数152ベストアンサー獲得回数0

ポイント25pt

特に大きな問題はありませんが

align=leftはalign=”left”にするべきでしょう

逆にwidth=”300”はwidth=300でかまいません

現状ではIEとネスケで確認すれば十分だと思います

id:cony

すみません。上記でも書いたのですが、はてなで”が化けてしまうため、一部省略して書いてしまいましたが、実際は全部入れています。

中途半端でごめんなさい。

「現状ではIEとネスケで確認すれば十分だと思います 」そうですね。ブラウザで見れればよしとするべきか・・。

2004/03/29 21:03:38
id:ohyah1999 No.5

回答回数72ベストアンサー獲得回数0

ポイント25pt

>>HTML文書の文法をチェックし、採点します。

Mac OS XおよびSafari、IE、Firefox、Mozilla、Opera、iCabで検証しましたがOKでした。

id:cony

ありがとうございます。

どなたか、ビルダーユーザーで詳しい方はいらっしゃいますでしょうか?

2004/03/29 21:05:26
id:reply No.6

回答回数787ベストアンサー獲得回数0

ポイント13pt

http://www.kanzaki.com/docs/html/htminfo16.html

テーブル -- ごく簡単なHTMLの説明

<table border=”1” cellspacing=”0” cellpadding=”0” width=”500”>

<tr>

<td colspan=”3”>幅500見出し</td>

</tr>

<tr>

<td width=”30”>A幅30</td>

<td align=left width=”170”>B=幅170</td>

<td align=left width=”300”>C=幅300のテキストスペースになります。幅300のテキストスペースになります。</td>

</tr>

</table>

id:cony

・・どの部分が問題で、上記サイトのどの部分に解説があるのでしょうか?

2004/03/29 21:09:36
id:tom_brown No.7

回答回数259ベストアンサー獲得回数0

ポイント25pt

> 崩れてしまう要因などもう少し詳しく教えていただけるとありがたいです。

自分もビルダーは持っていないのでなんとも言えないのですが、

スクリプトを単純化して原因を探るというのはどうでしょうか?

<table border>

<tr>

<td colspan=3>abc</td>

</tr>

<tr>

<td width=30>aaa</td>

<td width=170>bbb</td>

<td width=300>ccc</td>

</tr>

</table>

これでも崩れるならビルダーの方に原因があるとも考えられます。

これで崩れなければ、

cellspacing=0 cellpadding=0 width=500

を1つずつ入れて確認すれば原因を絞り出す事が出来ると思います。

id:cony

ありがとうございます。

問題の消去法としてはありですね。

2004/03/29 21:13:55
id:reply No.8

回答回数787ベストアンサー獲得回数0

ポイント13pt

<table border=1 cellspacing=0 cellpadding=0 width=500>

のところを

<table border=”1” cellspacing=”0” cellpadding=”0” width=”500”>

になおしてみました。

基本に戻れと言うことで。(^^)

id:cony

”に関しては、上記にコメントした通り、

実際作成したソースにすべて入れています。

・・・基本的なテーブルタグの問題だとしたら、

今まであげて頂いた感じで全てでしょうか。。

以下はスミマセンが同じ様なコメントはご遠慮ください。

ビルダー、もしくは、ブラウザに特化する問題点などありましたら、具体的にお願いします。

2004/03/29 21:23:37
id:Yue No.9

回答回数1ベストアンサー獲得回数0

ポイント25pt

http://www-6.ibm.com/jp/software/internet/hpb/

IBM 「PCサイトも携帯サイト作成もおまかせ!」ホームページ・ビルダー - Japan

ビルダーVer6.5ライトを使用しています。

conyさんのソースをそのままコピーして試してみましたが、おっしゃるようなテーブルの崩れは見当たらず、正確に表示されました。

以下余談ですが……一つ気になったのは、

下列の3マスは「セル幅」を固定しているにもかかわらず、

見出しの部分だけセル幅の固定をせずに「テーブル全体幅の固定」をしているところです。

実際私もビルダーで試してみましたが、

ソース1行目のテーブルタグで幅を500に固定した場合と、2行目の見出しのセルタグで幅を500に固定した場合では、

プレビューの際のテーブル幅が違っていました。

私の憶測ではありますが、セル幅の数値(この場合は30、170、300の、「テーブルラインの幅を含んでいない“セル幅のみ”」の数値)と

テーブル幅の数値(この場合はテーブルタグで表記されている500の、「テーブルラインの幅を含んだ“テーブル全体”」の数値)双方の数値が合致していないために生じた崩れではないでしょうか。

上記でvicdenさんがおっしゃっておられるように、

ソース1行目のテーブルタグにある「width=”500”」をソース2行目の見出しの部分に付け替えてみてください。

もしかしたら解消されるかもしれません。

ビルダー使用者として、私のバージョンのビルダーでは不具合は見当たらなかったということだけお伝えいたします。

余談が長すぎたことをお詫びいたします。ポイントは結構です。

id:cony

>余談が長すぎたことをお詫びいたします。ポイントは結構です。

とんでもありません。擬態的に指摘して頂き、ビルダーでの状況も教えていただけ、大変参考になりました。やはり、セル幅指定が鍵かもしれませんね。

ビルダーで自分で試して今すぐ結果を報告できないのが申し訳ありません。明日、早速不具合を指摘してくれた方にビルダーで皆さんの指摘してくださった問題点を検証してみます。ありがとうございました。

2004/03/29 22:54:47
  • id:reply
    の体験版

    的外れな回答をしてしまったお詫びとして、ホームページビルダーの体験版をダウンロードしてちゃんと表示されることを確認しました。

    http://www-6.ibm.com/jp/software/internet/hpb/download.html

    http://www-6.ibm.com/jp/software/internet/hpb/download.html
  • id:cony
    ありがとうございます。

    すみません。ご丁寧にありがとうございます。
    体験版のダウンロードができるんですね!今サイトを覗いてみました。
    私はMacなのでダウンロードできないのが残念です。でも、今後機会があったら利用できるかもしれませんので、情報感謝です。

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

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

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

回答リクエストを送信したユーザーはいません