0

私はこのコードを得ました：

    <div id="resizeDiv"><div id="title">Lol</div><div id="content"><iframe src='todo.php' height='100%' width='100%' frameborder='0px'></iframe></div></div>

これはcssです：

    #title{
      height: 25px;
      width: 100%;
      background: #c0c0c0;
      border-bottom: 1px solid #999;
    }
    #content{
      margin-bottom: 25px;
    }

そして、jqueryを使用してボックスのサイズを変更できるようにします。しかし、iframe は正確に 25px で外に出ます。私は試した：

    margin-bottom: 25px;

しかし、それはうまくいきません。誰かが私が間違っていることを知っていますか?

4

2 に答える 2

1

使用overflow: hidden:

#resizeDiv {
  overflow: hidden;
}

#content{
  margin-bottom: 25px;
}
于 2012-05-11T11:28:57.567 に答える
0

は実際には問題を修正しません。overflow: hiddenそれを隠すだけです。問題は、タイトルの高さが考慮されていないことです。jQuery のリサイズ機能では、次のようなものを使用してタイトルの高さを考慮します。

$("#content > iframe").height($("#resizeDiv").innerHeight() - $("#title").outerHeight());
于 2012-05-11T11:59:40.767 に答える