こちらの質問と同じです。
http://oshiete1.goo.ne.jp/qa4888659.html
IEにおいて、隣に結合したセルがあり、中央の高さを固定したいという状態です。
条件として、”基本HTMLは変更しない”が重要です。
テーブルの変わりにdivにする、などは求めていません。
■HTML
<table>
<tr>
<td></td>
<td rowspan="3">結合セル</td>
</tr>
<tr>
<td>高さを固定</td>
</tr>
<tr>
<td></td>
</tr>
</table>
HTMLで高さを指定しても、CSSでheightやmax-heightで指定しても伸びてしまいます。
何か方法はあるでしょうか?
No.3ベストアンサー
- 回答日時:
かなり邪道な気がしますが、後から、スクリプトでセルの高さを設定して回る方法。
あまりお勧めではありませんが、できないことはないと言う例示の意味で。
CSSなどでうまい設定がないもんかなぁ…(←あまり詳しくないのでわかりません)
サンプルでは2行目の高さを固定。
(テーブルの構成によって、若干違ってきますのであくまでも例示です。
高さの計算もちょっといい加減。)
(スクリプトを別ファイルにすれば、HTMLに追加1行でいけると思う。ただしスクリプトをオフにしていると効果はありません。)
<html>
<head>
<script type="text/javascript">
window.onload = function() {
var t, r, n, i, h=12; //←固定値
t = document.getElementsByTagName('TABLE')[0];
r = t.getElementsByTagName('TR');
t = (t.offsetHeight-h)/(r.length-1);
for (i=0; i<r.length; i++) r[i].getElementsByTagName('TD')[0].style.height = (i==1)?h:t;
}
</script>
</head>
<body>
<table border=1>
<tr>
<td></td>
<td rowspan="3">
結合セル
<p>このセルは
<p>長さが長く
<p>なっていったり
<p>文字がいろいろ
<p>はいっていたり
<p>画像なんかも
<p>いれてみたり
</td>
</tr>
<tr>
<td>高さを固定</td>
</tr>
<tr>
<td></td>
</tr>
</table>
</body>
</html>
なるほど…
HTMLやCSSではIEのブラウザの仕様上、どうしようもないと思っているのですが、
なにか裏技的なもので無理矢理にでも固定できれば…と思い質問しました。
試してみます!ありがとうございます。
No.5
- 回答日時:
条件は「ie6-8で、真ん中のtdの高さを固定する」とのことなので
fontsizeをpxで指定だけでいいんじゃないですか?
リンク先の条件(2行2列)を踏まえても、2回目の質問の返答からも
「真ん中のtdを右の結合セルの中央に揃え、かつ高さを固定する」とは思えないし。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・14歳の自分に衝撃の事実を告げてください
- ・架空の映画のネタバレレビュー
- ・「お昼の放送」の思い出
- ・昨日見た夢を教えて下さい
- ・ちょっと先の未来クイズ第4問
- ・【大喜利】【投稿~10/21(月)】買ったばかりの自転車を分解してひと言
- ・メモのコツを教えてください!
- ・CDの保有枚数を教えてください
- ・ホテルを選ぶとき、これだけは譲れない条件TOP3は?
- ・家・車以外で、人生で一番奮発した買い物
- ・人生最悪の忘れ物
- ・【コナン30周年】嘘でしょ!?と思った○○周年を教えて【ハルヒ20周年】
- ・ハマっている「お菓子」を教えて!
- ・最近、いつ泣きましたか?
- ・夏が終わったと感じる瞬間って、どんな時?
- ・10秒目をつむったら…
- ・人生のプチ美学を教えてください!!
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・都道府県穴埋めゲーム
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
テーブルの行を折りたたみたい...
-
TRタグの余白をcssで設定するには
-
ホームページ 表の上の余白を...
-
HTMLで文とテーブルの間が空く。
-
tableにul,または,olを入れられ...
-
表の一部を結合するには?
-
テーブルのヘッダとボディの幅...
-
44行目: パラメータ '__format'...
-
スタイルシートで colspan=3と...
-
CSSだけで<table>の<td>や<tr>...
-
テーブルの大きさが変わらない...
-
値が0なら非表示にしたい
-
チェックボックスが複数チェッ...
-
テーブルの任意の列を非表示に...
-
テーブルの枠線(外内両方)を...
-
htmlで作成するテーブルの横線...
-
width指定したTDでwhite-space:...
-
文字列が入っているtdを削除せ...
-
ホームページビルダ14で、表の1...
-
テーブルの中のフォームについて
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
テーブルの行を折りたたみたい...
-
tableにul,または,olを入れられ...
-
TRタグの余白をcssで設定するには
-
cssで、表示されるテキストによ...
-
テーブルの任意の列を非表示に...
-
テーブルのヘッダとボディの幅...
-
ホームページ 表の上の余白を...
-
テーブルのセルに画像をピッタ...
-
中に<table></table>が使えるア...
-
文字列が入っているtdを削除せ...
-
逆L字の表(table)組み
-
スタイルシートで colspan=3と...
-
テーブルの装飾
-
EXCELのセル内にHTMLタグを含む...
-
tableの要素(tr、td)に一...
-
テーブルの表示がずれます
-
tableでcolspanを使うと次行以...
-
HTMLで文とテーブルの間が空く。
-
テーブルの行の高さを指定する...
-
値が0なら非表示にしたい
おすすめ情報