テーブルは、私が現在持っている拡大のdiv

Question

垂直に成長しておいてください。

<div class="generic-block-70"> 
    <div class="generic-content-70"> 
     <table id="voteBlock"> 
      // stuff 
    </table> 
    </div> 
</div> 

しかし、generic-block-70とgeneric-content-70が設定された高さを持っていないと、彼らはテキストが追加されると、私はできません垂直拡張として見て私のテーブルのスタイルをheight: 100%;に設定するだけです。

方法はありますか？

JSFiddle：http://jsfiddle.net/2vLEL/コードが意図に依存

Answer 1

divにoverflow: auto;を設定してください。

http://jsfiddle.net/2vLEL/2/

.generic-content-70 { 
    overflow: auto; 
} 

Answer 2

：あなたは高さにテーブルをロックしたい場合は、それに高さを与える

• ：NNpx。
• divを高さにロックする場合は、ITに高さを指定します。NNpx;オーバーフロー：MM;あなたのニーズに応じて

Answer 3

私はおそらく同様の問題があったと思います。これが私が解決した方法です。 テーブル内にネストされたテーブルがあります。 ユーザーがボタンをクリックすると、Javascriptによって新しい表の行とセルが作成され、フォームのデータでセルが埋められました。セルにテキストをラップし、水平方向に展開しないようにするには、セル内に<div></div>タグを使用する必要がありました。 新しい表の行が追加されたときに、「表」を垂直に展開しないようにするには、<td>の下に<div></div>というタグを配置する必要がありました。

私のjavascriptから作成されたHTMLはこのように見えます。

<table id="root"> 
<tr id="A"> 
    <td id="1" style="width:200px">Content</td> 
    <td id="2" style="width:530px"> 
    <div height="correct_height" overflowY="auto"> 
    <table id="comments_table" style="width:510px table-layout:fixed"> 
    <tr> 
     <td style="word-wrap:break-word"> 
     <div style="width:480px;white-space:nowrap">Comments</div> 
     </td> 
    </tr> 
    </table> 
    </div> 
    </td> 
</tr> 
. 
. 
. 
</table> 

最初の<td id="1">は、最初に実行される関数によって作成されます。 2番目の<td id="2">は、後で実行される関数によって作成され、<td id="1">の高さを取得して、行の2番目のセルの高さがその行の1番目のセルの高さに依存するようにします。 幅は、垂直スクロールバーが表示されるように配置されます。

使用するパディングを引き算する必要があります。例えば、要素のうちの2つがstyle="padding:5px"を有する場合、これは5topの5bottom×2要素を意味する。だから：

var correct_height = A.offsetHeight - 20;