重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら＞

【GOLF me！】初月無料お試し

<table>の高さ固定。情報増加時、高さ自動変化

解決済

  • 質問者：tekkenman7
  • 質問日時：
  • 回答数：3件

<table>で<td>の中に入れる文字の行が
多くなったり少なくなったりする形のもので
少ないときは高さを150pxに固定し、
多くなったときは行数に合わせて
自動的に高さが変化するものを作りたいです。
サンプルを作ってみました。
アドバイスをお願いいたします。

<html>
<head>
<title></title>
<body>
<table style="width:200px; height:150px; background-color:#ccc; vertical-

align:top; display:block; margin:20px;">
<tr>
<td>
<ul>
<li>あいうえお</li>
<li>あいうえお</li>
</ul>
</td>
</tr>
</table>

<table style="width:200px; height:150px; background-color:#ccc; vertical-

align:top; display:block; margin:20px;">
<tr>
<td>
<ul>
<li>あいうえお</li>
<li>あいうえお</li>
<li>あいうえお</li>
<li>あいうえお</li>
<li>あいうえお</li>
<li>あいうえお</li>
<li>あいうえお</li>
<li>あいうえお</li>
<li>あいうえお</li>
</ul>
</td>
</tr>
</table>
</body>
</html>

通報する

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

質問の本文を隠す

A 回答 (3件)

No.3ベストアンサー

  • 回答者： taka451213
  • 回答日時：

こんばんは。



TABLEのheight:150px;をやめる。
TDにstyle="min-height:150px;"
    • good
    • 6
    • 件
通報する
この回答へのお礼

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

通報する
お礼日時：2011/04/22 21:21

No.2

  • 回答者： naokita
  • 回答日時：

height:150px;


ではなく、
min-height:150px;

IE6も考慮するなら、
* html table{ height: auto !important; height: 150px;}
    • good
    • 1
    • 件
通報する
この回答へのお礼

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

通報する
お礼日時：2011/04/22 21:21

No.1

  • 回答者： marutone
  • 回答日時：

このソースに以下のソースを加えてみてください。



<style type="text/css">
ul{
margin-top:0px;
margin-bottom:0px;
}
</style>
    • good
    • 0
    • 件
通報する
この回答へのお礼

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

通報する
お礼日時：2011/04/22 21:22

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

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

このQ&Aを見た人がよく見るQ&A

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報