javascript - position: 要素が消える絶対

Question

私が抱えているこの問題を解決する方法があるかどうか疑問に思っています。

互いにネストされた3つのdivがあります

<div class="section">
<div class="parent">
<div class="child">
Some text.. blah blah. 
</div>
</div>
</div>

このjavascriptを使用して、子の高さによって決定される親の高さを作成しました:

  $(document).ready(function() {
            var $holdme = $(".holdme");
           $holdme.parent().height($holdme.outerHeight());
        });

ただし、これは子要素が絶対配置されていない場合にのみ機能します。.child を position:absolute に設定すると、親要素と子要素が消えます。子を絶対に設定し、親コンテナの高さを子の高さに合わせて変更する方法はありますか?

ここにフィドルがあります...現在は正しく機能していますが、子要素の絶対位置が設定されていません。position:absolute の周りからコメントマークアップを削除すると、すべてが壊れます。

score 2 · Accepted Answer

あなたの HTML はholdmeクラスを使用しておらず、あなたのフィドルは jQuery をインポートしていませんでした。これらの両方を修正すると、正常に機能します。

    $(document).ready(function() {
         var $holdme = $(".child");
        $holdme.parent().height($holdme.outerHeight());
     });

score 2 · Accepted Answer

.holdmeどこにもクラスが適用されていません...

それはすべき.chlidですか？

var $holdme = $(".child");

この変更を加えれば、思い通りに動作します。

score 1 · Accepted Answer

作業バージョンのフィドルを次に示します。

    $(document).ready(function() {
         var $holdme = $(".child");
        $holdme.parent().height($holdme.outerHeight());
     });

</p>

オーバーフローを削除しました: ルール.. 重要かどうかはわかりませんが、私のワークフローの一部です

3 に答える 3