<TABLE>の<TD>タグの幅指定について

質問

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

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

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

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

回答No.2

UUURRGGHHYY · ベストアンサー

<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>

のようにすることで、理不尽なレイアウトになることを防ぐことができます。

お礼

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

回答No.1

callhiro

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

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

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

お礼

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

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