<FORM>を2つに切って、その表示がずれてしまうという記事が少し前にありましたが、多少内容がかぶるかもしれません。

列項目が全く同じ2つの表を上下に並べて表示しようと思っています。
<TABLE>タグはWIDTHの指定ができるので表全体のサイズは上下でそろっているのですが、その中の項目の縦の線がずれてしまいます。

原因はその項目に表示される内容が上の表と下の表とで異なっていることによるズレのようです。
(<TD>のタグにはwidthの指定が無く、<TABLE>全体として、バランスが取れるように自動的に中の項目幅を調整してしまうためらしいです(--; )

何か画期的な裏技がありましたら、教えてください。
お願いします。

A 回答 (2件)

<td>の属性で、width="500" のような指定も出来ますが、そうやってきっちりと幅指定をしても、ブラウザが勝手にレイアウトを変更してしまうこともよくあります。

これを防ぐには、透明な1pixelのgifを利用する方法が有効です。
(HTML4.01では、本来推奨されていないアプローチのようですが。)

たとえば、
<table width="100">
<tr><td width="50">abc</td><td width="50">ABC</td></tr>
<tr><td width="50">abcdefg</td><td width="50">AB</td></tr>
</table>

としたが、意図した表示と異なる場合には、

<table width="100">
<tr height="1"><td width="50"><img src="clear.gif" width="50" height="1"></td><td width="50"><img src="clear.gif" width="50" height="1"></td></tr>
<tr><td width="50">abc</td><td width="50">ABC</td></tr>
<tr><td width="50">abcde</td><td width="50">AB</td></tr>
</table>

のようにすることで、理不尽なレイアウトになることを防ぐことができます。
    • good
    • 0
この回答へのお礼

イメージタグによる幅指定はテーブルの持つそれよりも強力なようですね。参考にさせていただきます。

お礼日時:2001/01/30 17:13

<TD>タグにもwidthの指定ができますので



<table width=100% border=1>
<tr>
<td width=50%>一つ目</td>
<td>二つ目</td>
</tr>
</table>

の様に記述すれば、一つ目と二つ目の列幅が同じになりますよ。
<td>タグの中の50%は、テーブル幅の中のパーセント分かを示します。
やってみてくださいな。
    • good
    • 0
この回答へのお礼

一昔前には確かにwidthタグはあったんですけどね。
なぜか最近のHTMLタグ辞典を見るとないんですよー。

規格から外れたのでしょうか?

お礼日時:2001/01/30 17:12

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

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qタグの中にタグは入れられないのでしょうか

<TABLE><TR><TD>
<OBJECT>
<PARAM>
</OBJECT>
</TD></TR></TABLE>

という感じであるアプリを組み込みたいのですが、TABLEの下に隠れているようで表示されません。
TABLEを透明にしたり、<OBJECT>をTABLEの上に持ってくることはできないのでしょうか。

Aベストアンサー

よくは分かりませんが、
↓これはうまくいくようです。

<TABLE cellSpacing=1 cellPadding=1 width="75%" border=1>
<TR>
<TD></TD>
<TD></TD>
<TD></TD></TR>
<TR>
<TD></TD>
<TD>
<OBJECT id=SHDocVw style="WIDTH: 318px; HEIGHT: 200px" classid=clsid:8856F961-340A-11D0-A96B-00C04FD705A2></OBJECT>
</TD>
<TD></TD></TR>
<TR>
<TD></TD>
<TD></TD>
<TD></TD></TR></TABLE>

Q
  • タグについて

    初心者です。

    <li>と<table>タグについて、どのような基準で使い分けるのでしょうか?

    何かのページで表として認識できる場合は<table>とありましたが、実際には<li>で記述されているケースが多いように感じます。それぞれのメリット・デメリットを教えていただけるとありがたいです。

    Aベストアンサー

    リストと表の違いで区別するのが良いでしょう。
     ul li は、デフォルトで、頭に " ・ " が付きますから、
    HTML(マークアップ)的に考えれば、箇条書きです。

    表は、エクセルで作る様な「表」と考えれば良く、
    セルの枠線(border)が表示されても表現的に問題ない場合が「表」です。

    マークアップを無視して、レタリングだけなら、
    CSSで、どちらでも(それ以外の方法でも)同じに表示出来ます。

    また、tableの場合、クローラーのセルの読み込み順が変わる場合がありますので注意が必要ですし、旧IEでの差異もあります。
    後から、セルの追加で列計算がある場合に修正がちょっと面倒です。
    CSSが利用出来る昨今は、tableが嫌われる方向です。
    大きなtableは読み込みが遅くなるので、表示が遅くなります。

    初心者は、簡単にtableレイアウトで全体を作る事が出来るので、
    利用しがちだったり、某簡易ソフトもtableレイアウトが多いですね・・・

    良く見掛けるのは、ナビ(グローバル)メニューの部分ですが、
    table でも ul でも作れますが、項目リストと考えれば、
    ul li が正解でしょう。簡単なのはtableで固定する方法ですが・・・

    リストと表の違いで区別するのが良いでしょう。
     ul li は、デフォルトで、頭に " ・ " が付きますから、
    HTML(マークアップ)的に考えれば、箇条書きです。

    表は、エクセルで作る様な「表」と考えれば良く、
    セルの枠線(border)が表示されても表現的に問題ない場合が「表」です。

    マークアップを無視して、レタリングだけなら、
    CSSで、どちらでも(それ以外の方法でも)同じに表示出来ます。

    また、tableの場合、クローラーのセルの読み込み順が変わる場合がありますので注意が必要ですし、旧IEでの差異...続きを読む

    Q

    内のテキストのサイズ

    以下のようなソースで,TEXTの部分のサイズを変更したいと思い,<table>~</table>を含む範囲をを<div class="test">~</div>で挟んで,スタイルシートで指定してみました.
    そしたら,<div class="test">~</div>の中でも<table>~</table>の外にあるテキストはサイズが変わるのですが,下のソースのTEXT部分は変わりませんでした.
    表中のテキストのサイズを一括して指定する方法はあるのでしょうか?

    <table align="center">
    <tr bgcolor="#aaffaa">
    <td>TEXT</td><td>TEXT</td><td>TEXT</td>
    </tr>
    <tr bgcolor="#aaaaff">
    <td>TEXT</td><td>TEXT</td><td>TEXT</td>
    </tr>
    </table>

    Aベストアンサー

    いろいろやり方がありますが、

    1.全てのテーブルで文字サイズを指定するときは

    <STYLE type="text/css">
    <!--
    TABLE{font-size : 24px;}
    -->
    </STYLE>

    を<HEAD>と</HEAD>の間に入れます。

    2.テーブルごとに文字サイズを指定するときは

    <CENTER>
    <TABLE style="font-size : 24px;text-align : center;">
    <tr bgcolor="#aaffaa">
    <td>TEXT</td><td>TEXT</td><td>TEXT</td>
    </tr>
    <tr bgcolor="#aaaaff">
    <td>TEXT</td><td>TEXT</td><td>TEXT</td>
    </tr>
    </TABLE>
    </CENTER>

    3.クラスを使って文字サイズを指定するときは

    <STYLE type="text/css">
    <!--
    .text{font-size : 24px;}
    -->
    </STYLE>
    </HEAD>
    <BODY>
    <CENTER>
    <TABLE class="text">
    <tr bgcolor="#aaffaa">
    <td>TEXT</td>
    <td>TEXT</td>
    <td>TEXT</td>
    </tr>
    <tr bgcolor="#aaaaff">
    <td>TEXT</td>
    <td>TEXT</td>
    <td>TEXT</td>
    </tr>
    </TABLE>
    </CENTER>

    いろいろお試しいただければと思います。

    いろいろやり方がありますが、

    1.全てのテーブルで文字サイズを指定するときは

    <STYLE type="text/css">
    <!--
    TABLE{font-size : 24px;}
    -->
    </STYLE>

    を<HEAD>と</HEAD>の間に入れます。

    2.テーブルごとに文字サイズを指定するときは

    <CENTER>
    <TABLE style="font-size : 24px;text-align : center;">
    <tr bgcolor="#aaffaa">
    <td>TEXT</td><td>TEXT</td><td>TEXT</td>
    </tr>
    <tr bgcolor="#aaaaff">
    <td>TEXT</td><td>TEXT</td><td>TEXT</td>
    </tr>
    </TABLE>
    </CENTER>

    ...続きを読む

    Q
    内のFONT指定について。

    <table></table>内のFONT指定で、毎回
    <font size=2>をセルごとに入れていますが、セルの数が多く、サイトの負担が大きくなります。
    tableごと、あるいは、ページごとに一括で指定はできないのでしょうか。
    スタイルシートは、あまりなじみがありません。

    よろしくお願いします。

    Aベストアンサー

    こんにちは


    table要素全体に文字を調節する場合は、

     head要素に
    <meta http-equiv="Content-Style-Type" content="text/css">
    <link rel="stylesheet" href="style.css">
    を追加します。

     table要素に
    class="(1)"を追加します。
    <table class="(1)">
    (1)に適当な名前をつけてください。
    /////////////////////////////////////////////
    テキストエディタで、新しくファイルを作成して、
    font-size: (2)

    (2)にはフォントサイズを入れます。数字だけの指定はできません。おすすめはem単位です。現在のフォントの大きさを基準として、大きさを決めます。たとえば、2倍大きくしたいのならば、2emと書きます。

    と書いて、HTMLファイルがあるフォルダに、style.cssとタイトルをつけて保存します。

    /////////////////////////////////////////////

    CSSについて、わかりやすいホームページは
    http://www6.plala.or.jp/go_west/beginner/css/
    1と2の間辺りからはじめるCSS講座
    は、楽しいと思います。

    こんにちは


    table要素全体に文字を調節する場合は、

     head要素に
    <meta http-equiv="Content-Style-Type" content="text/css">
    <link rel="stylesheet" href="style.css">
    を追加します。

     table要素に
    class="(1)"を追加します。
    <table class="(1)">
    (1)に適当な名前をつけてください。
    /////////////////////////////////////////////
    テキストエディタで、新しくファイルを作成して、
    font-size: (2)

    (2)にはフォントサイズを入れます。数字だけの指定はできません。おすすめはem単...続きを読む

    Q?
    の中にHTMLを表示させる方法

    <table>?</table>の中にHTMLを表示させる方法をご存知のかたが、
    いらっしゃいましたら教えてください。

    Aベストアンサー

    <table>
    <iframe src="URL">

    </iframe>
    </table>

    で可能です。
    インラインフレームが使ってあります。
    URLはそのHTMLのURLに置き換えてください。
    インラインフレームの枠の消し方などはリンクを参考に。

    参考URL:http://heo.jp/tag/page/iframe.html


    人気Q&Aランキング

    おすすめ情報