IEで正しく見えるのにNNだと表の形が崩れてしまう

質問

ホームページビルダー2001を使用して作成しています。動作確認などは殆どwinでIEでしか確認していなかったので気づかなかったのですが、NNだと表の幅が崩れてしまいます。
一応、タグを見たのですが、（spanというのですか？）いくつもある表の幅の指定は同じように指定してあるのです。
それでも、表によって列幅が変わって表示されてしまうのはなぜでしょう？
どなたかお教えください。

回答No.3

Naodon1020 · ベストアンサー

<COL span="1" width="25">
<COL span="1" width="260">
<COL span="1" width="155">
<TBODY>
　：
</TBODY>

ではなく、

<TABLE border="1" width="800">
<TR>
<TD bgcolor="#99cc99" WIDTH="25">　</TD>
<TD align="center" bgcolor="#99cc99" WIDTH="260"><FONT size="-1">あ</FONT></TD>
<TD align="center" bgcolor="#99cc99" WIDTH="260"><FONT size="-1">い</FONT></TD>
<TD align="center" bgcolor="#99cc99" WIDTH="260"><FONT size="-1">う</FONT></TD>
</TR>
</TABLE>

と、すべきです。

お礼

Naodon1020さん、ありがとうございます。

ホームページビルダでは、表の列全ての幅を一度に指定できるのですが、それを使わずに、セルの列ごとに幅を指定してやれば、<COL span=***>をつけることなく、幅の設定が出来るようです。
便利な機能だと思って使っていたのに・・・がっかりです。

IEで見れば、<TD>の中で設定するのも<COL span>で設定するのも同じに見えるので気づかないところでした。なるほど、「ホームページ作成ソフトに頼ってばかりいると、タグの基本を覚えないし、無駄なタグばかり多くなると」言われたことがありますが、本当にそうですね。
もっとタグを勉強します。

colorが違って見えるのは、多少は仕方ないとも思いますが、NNとIEとの違いで他に気をつけなければならない点は、どういったことでしょうか？
もしお時間あれば、お教えください。

回答No.2

Naodon1020

NN、IEで共通の、セル幅指定方法は、widthです。
例えば、

<TABLE BORDER WIDTH=85%>
<TR>
<TD WIDTH=100>あ</TD>
<TD WIDTH=250>いう</TD>
<TD>えお</TD>
</TR>
<TABLE>

と指定すると、表全体はブラウザウインドウの幅の85%に指定され、
「あ」のセルが100ピクセル、「いう」のセル幅が250ピクセル、
残りが「えお」のセルになります。

WIDTH=**では、％もしくはピクセル数を指示します。

ユーザーがブラウザで指定したフォントの大きさにより、WIDTHで指定した幅よりも文字が大きくなってしまう時に、文字が折り返さないようにしたい場合は、

<TD WIDTH=100 NOWPAP>あいうえお</TD>

というように、NOWRAPを挿入します。

基本的には、スタイルシートを使わなくても指定できる内容は、なるべくスタイルシートを使わないようにすべきです。
またTABLEタグについてはIEとNNでの解釈の違いも目立ちます。特にBORDERCOLOR等の属性は、まったく見え方が異なりますので注意が必要です。上手くタグを書いてあげれば、見え方をほぼ同じにする事が出来ますが、これは経験を積み重ねるしかないでしょう。

回答No.1

peso

表を定義するタグは<TABLE>～</TABLE>です。
その間に<TR>～</TR>が表の１行になります。
さらにその中の<TD>～</TD>が１つのセルの内容になります。
その<TD>が例えば、<TD style="width:100px">のようにスタイルシートでセル幅を指定していると、NNでは無視されます。（ちなみに、これはこのセルの横幅を100ピクセルにしなさい、ということです。）セルの幅はその列の１番長い文字列の幅に自動的に調節されます。

補足

＜TD＞の中では特にセル幅の指定はしていません。スタイルシートも使ってないのですけれど。
ちなみに
<TABLE border="1" width="800">
<COL span="1" width="25">
<COL span="1" width="260">
<COL span="1" width="155">
<TBODY>
<TR>
<TD bgcolor="#99cc99">　</TD>
<TD align="center" bgcolor="#99cc99"><FONT size="-1">あ</FONT></TD>
<TD align="center" bgcolor="#99cc99"><FONT size="-1">い</FONT></TD>
<TD align="center" bgcolor="#99cc99"><FONT size="-1">う</FONT></TD>
</TR>
</TBODY>
</TABLE>
といったテーブルをいくつかコピーして使ってるのですけれど、どうなのでしょう？