tableでレイアウトが崩れる場合

解決済

質問者：impressa
質問日時：2007/12/25 02:07
回答数：1件

技術の足りなさからCSSにできなかったので、再度テーブルでサイズを指定してやってみようとしているところです。
どこかの数字がおかしくなっていると思うのですが、どうしてもわかりません。
ちゃんと表示できるブラウザとそうでないブラウザがあり、Firefoxは環境設定により表示が崩れる場合があります。
使用ソフトはビルダーの１１です。
なんでも良いのでどうぞアドバイスをよろしくお願い致します。

<body>
<div ALIGN="center">
<table>
<tbody>
<tr>
<td CLASS="td4" HEIGHT="70">
<table WIDTH="600" CELLSPACING="1" CELLPADDING="0">
<tbody>
<tr>
<td VALIGN="top" CLASS="td1" WIDTH="400" ALIGN="left" HEIGHT="180">
<b>文字
<textarea ROWS="15" COLS="70">文字</textarea><br>
<br>
</td>
<td VALIGN="top" CLASS="td1" WIDTH="100" HEIGHT="180">
<table CELLSPACING="0" CELLPADDING="4">
<tbody>
<tr>
<td CLASS="td2" HEIGHT="16" WIDTH="100">文字</td>
</tr>
</tbody>
</table>
文字
<br>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<br>
</div>
</body>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： kazumero
回答日時：2007/12/25 12:00

テキストエリアの横幅が、ブラウザによって違うことが原因ですね。

cols="70"は、IEだとwidth="400"以内に収まりますが、FireFoxではwidth="600"くらいないと収まらないようです。
収まらないと、サイズ指定を無視してしまうので、文字の表示が崩れるわけです。
今回の解決策ですが、tableの横幅とtextareaのセルの横幅の指定を外し、自動調整機能に頼ることにしました。
そうすることにより、textareの横幅に合わせてセルの横幅が設定されるので、文字の崩れを抑えることが出来ます。
また、tableを入れ子にしすぎているのと、文法的誤りが気になったので、軽く修正してみました。

<html>
<head>
<title>テスト</title>
</head>
<body>
<div align="center">
<table cellspacing="1" cellpadding="0">
<tbody>
<tr>
<th valign="top" class="td1" align="left">
あああ
</th>
<td width="200">
ううう
</td>
</tr>
<tr>
<td>
<textarea rows="15" cols="70">いいい</textarea>
</td>
<td valign="top" class="td1">
えええ
</td>
</tr>
</tbody>
</table>
<br>
</div>
</body>
</html>