0

そのdivの幅がであるときに、divの幅を最も近い兄弟と同じに設定することは可能width: auto;ですか?

私のjsFiddleには、赤、緑、青のdivがあることがわかります。青のdivを緑のdivのサイズ(動的)に調整したいと思います。したがって、緑のdivが200ピクセルになる場合は、青のdivを200ピクセルにします。

もともと私は青いdivを緑のdivの中に入れて子供にセットできると思っていましたが、これはうまくいきdisplay: inline-blockません。

したがって、青のdivのコンテンツが増加しても、緑のdiv(またはコンテナdiv)の幅は押し出されません。これはどのように達成できますか?

4

2 に答える 2

1

JavaScriptを使用する場合は、変更を追跡するdivがいつでも幅を調整できます。jQueryを使用すると、簡単です。

$(document).ready(function() {
    // Function to sync the sizes of the divs
    function syncSize() {
        $("#banner_description").width($(".banner_secondary_title").outerWidth(true));
    }

    // Sync the size when a change is made
    $(".banner_secondary_title").resize(function(e) {
        syncSize();
    });

    // Initial sync after document setup
    syncSize();
});

これは、このコードが追加されたjsFiddleのフォークです。さらに、セカンダリタイトルにテキストを追加して、それが機能することを示すために拡張しました。

于 2012-09-26T17:14:23.030 に答える
0

青いdivを緑のdivの中に入れ、非常に高いネガティブmargin-right-999emまたは何か)を青いdivに追加して、親の緑のdivが引き伸ばされないようにします。

別の解決策:青いdivを緑のdivの中に入れ、青いdivにaを付けposition:absoluteます。緑のdivをpadding-bottom青のdivの高さに一致させます。これは、青いdivの高さが動的でない場合にのみ機能します。

于 2012-09-26T16:25:44.193 に答える