1

誰かが CSS の問題で私を助けてくれることを願っています。JavaScript を使用してテーブルに追加の行を追加していますが、正常に機能していますが、新しい行を追加してもページが拡張されません。つまり、コンテンツがページから消えて見えなくなります。

これが私のウェブページの簡略版です。

<div class="wrapper" >
  <section id="main" class="column">
     Expanding table code here.
  </section>
</div>

次のCSSもあります。

.wrapper {
width:1200px; 
overflow:hidden; 
margin:0 auto; 
border:1px solid #999;
border-bottom:2px solid #999;
}

section#main {
width: 77%;
min-height: 500px;
float: left;
margin-top: -2px;
}

オーバーフローを追加しようとしました:hidden; これはうまくいくかもしれないと思ったが、うまくいかなかったので、メインセクションのCSSに。メイン セクションを削除すると正常に動作しますが、ラッパー div 内に他のコンテンツがあるため、これが必要です。

これは私を怒らせているので、どんな助けも大歓迎です!!!

前もって感謝します ：）

4

1 に答える 1

1

[編集: コメントで、OP が既に float クリア方法を使用していることが指摘されました。同様の問題を抱えているがCSSをクリアしていない人に役立つ場合に備えて、ここに私の答えを残します。]

それはあなたが浮いているからですsection#main。浮動領域は、実際には垂直方向のスペースを占有しないため、それらの後にクリア div (または浮動クリア css) が必要です。次のように実行できます。

<div class="wrapper" >
  <section id="main" class="column">
     Expanding table code here.
  </section>
  <div style="clear: both;"></div>
</div>

これ<div style="clear: both;"></div>は従来の方法ですが、ここで説明されている新しい方法を検討することをお勧めします: http://www.quirksmode.org/css/clearing.html

于 2012-11-30T23:15:48.230 に答える