プロが教えるわが家の防犯対策術!

safariでcolspanでセルを結合し、その中に大きい要素(下の例ですとwidth500pxの画像や、文字数60のテキスト領域)を入れると、他の行の幅が変わってしまいます。

スタイルシートでtd幅を指定してやったりしてみたのですが、どうしても幅が変わってしまいます。
何か解決方法等ございましたら、ご教授願います。

<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="20%" align="center" bgcolor="#99FFFF">20%</td>
<td width="80%" align="center">80%</td>
</tr>
<tr>
<td colspan="2" align="center" bgcolor="#FFCCCC"><img src="http://cmm001.goo.ne.jp/img/sn/sn_50.gif" width="500" height="24"></td>
</tr>
</table>
<br>
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="20%" align="center" bgcolor="#99FFFF">20%</td>
<td width="80%" align="center">80%</td>
</tr>
<tr>
<td colspan="2" align="center" bgcolor="#FFCCCC"><form name="form1" method="post" action="">
<textarea name="textarea" cols="60"></textarea>
</form>
</td>
</tr>
</table>
<br>
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="20%" align="center" bgcolor="#99FFFF">20%</td>
<td width="80%" align="center">80%</td>
</tr>
<tr>
<td colspan="2" align="center" bgcolor="#FFCCCC"></td>
</tr>
</table>

A 回答 (2件)

Webkit 系のブラウザだとサイズを百分率で指定すると確かにおかしくなるようですね。

多分バグだと思います。

ソースを見て思ったのですが table の width が固定サイズなのならば、素直にピクセル単位で指定するのが一番手っ取り早い解決方法だと思います。
<tr>
<td width="120px" align="center" bgcolor="#99FFFF">20%</td>
<td width="420px" align="center">80%</td>
</tr>

リキッドレイアウトにする場合は…
とりあえず Webkit 系のブラウザの存在を忘れる!とか
    • good
    • 0
この回答へのお礼

やはりバグなのですねー。
ちょっと特殊な動的ページだったので、%で指定出来ればと思ったのですが、サイズ指定で製作する事にしました。

ありがとうございました!

お礼日時:2010/03/23 15:34

け、計算を間違えてた・・・_| ̄|○ |||


<td width="480px" align="center">80%</td>

小学生の暗算レベルなのに
    • good
    • 0

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