css - フローティングdivはコンテナの高さを拡張していますが、内側のdiv要素にパーセンテージの高さを適用した場合、高さは定義されていません

Question

複数のフロートdivを含むコンテナdivがありますコンテナ内の特定のボーダーdivにコンテナ自体の90％の高さを持たせたいのですが、clearを適用してもコンテナの高さが検出されないようです：両方コンテナの最後でオーバーフローします：コンテナdivに非表示になります。

Answer 1

js次のスクリプトを使用できます。

<script type="text/javascript">
    $(document).ready(function() {
        setHeight();
        $(window).resize(function() {
           $('.seperator2').css({ height: '50px'});
           setTimeout(function(){
              setHeight();
            },300);        
        });
   });
  function setHeight(){
     var contentH = $('.content').height();
     separatorH = parseFloat(contentH * 0.9);
     $('.seperator2').css({ height: separatorH });
  }
</script>

このスクリプトは、ページの先頭または一番下に配置できます。場所に関係なく、最初にjQueryライブラリをリンクするようにしてください。

注：ライブラリをヘッド（またはページの他の場所）にリンクjQueryするには、次のスクリプトを使用します。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

編集：要素のを0に設定するheightか、完全に削除することができます。それでも私はおそらくそれをそのままにしておきheight: 100;ます; これにより、スクリプトが実行される前に、ページが適切に表示されます。