人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

「HTMLのcolspanで、セルの幅が意図したとおりに一定の幅をとってくれない」という質問です。

以下のHTMLだと、意図どおりにどのセルもだいたい同じ幅で表示されるのに(上図)、
先頭の1行(xのセル)を削除すると、とたんにBのセル幅が縮まる(下図)のを回避する方法を教えていただけないでしょうか。
<td>タグで1つ1つに広さを指定する方法以外でお願いいたします。

※なお回答者が過去の質問の様子からポイントゲッター的であると判断した場合、回答をオープンしません。あしからずご了承ください。

<html>
<head></head>

<body>

<table border=1 width=50%>
<tr>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
</tr>
<tr>
<td rowspan=3>A</td>
<td colspan=2>B</td>
<td>C</td>
<td rowspan=2>D</td>
</tr>
<tr>
<td>E</td>
<td rowspan=2 colspan=2>F</td>
</tr>
<tr>
<td>G</td>
<td rowspan=2>H</td>
</tr>
<tr>
<td colspan=4>I</td>
</tr>

</table>

</body>
</html>

1272328680
●拡大する

●質問者: lionfan
●カテゴリ:インターネット ウェブ制作
✍キーワード:HTML あしからず オープン ゲッター セル
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● koriki-kozou
●20ポイント

ブラウザはセルの幅や高さを必要分だけ用意するため当然の結果


><td>タグで1つ1つに広さを指定する方法

確かに面倒


>以外

スタイルシートで最低幅を指定しておくと楽


min-width?スタイルシートリファレンス

http://www.htmq.com/style/min-width.shtml

◎質問者からの返答

koriki-kozou様、ありがとうございます。了解です。


2 ● mamekko
●50ポイント ベストアンサー

確かに、そうなることは確認しました。

最初の状態では、1行目にあきらかに5列(?が5セット)あるので、2行目以降のcolspanがうまくきいています。しかし、1行目を削除すると、新しい1行目はA,B,C,Dの4つの列しかなくなります。Bでcolspanをしていしていても、あくまでテーブルの列の数は1行目の列の数できまりますので、無視されてしまっています。

どうしても、最初の状態と同じようにしたいのであれば、

<td colspan=2>B</td>

のところを、

<td style="border-right-width:0px">B</td>
<td style="border-left-width:0px">&nbsp;</td>

のようにすれば、見た目上はなんとかなりそうです。

◎質問者からの返答

memamii様、親切なご回答、ありがとうございます。

たいへん助かりました。いるかをどうぞ。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ