Question

我绝对将div定位在相对定位的父级内。我想检查绝对定位的子项的外部高度，并使用jquery将其作为最小高度应用于父项。 Div在一个网站上重复几次，这是我的主要问题。到目前为止，我有：

HTML

<article class="post">
    <div class="entry-main">
        <div class="entry-meta">
            Lorem<br />
            Ipsum
        </div>
        <div class="entry-content">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit
        </div>
    </div>
</article>

<article class="post">
        <div class="entry-main">
            <div class="entry-meta">
                Lorem<br />
                Ipsum<br />
                Dolor<br />
                Sit <br />
                Amet
            </div>
            <div class="entry-content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit
            </div>
        </div>
    </article>

的jQuery

$('.post').css('min-height', $('.entry-meta').outerHeight());

CSS

.post {
    border: 1px solid red;
    }
.entry-main {
    position: relative;
}
.entry-content {
    margin-left: 220px;
}
.entry-meta {
    position: absolute;
    width: 170px;
    text-align: right;
}

问题是我的新手jquery代码会检查第一个.entry-meta的高度，然后对所有.post文章应用相同的高度。我想在每个.post文章中检查每个.entry-meta div高度并相应地应用：

第一个.entry-meta =第一个.post
第二个外部高度.entry-meta =第二个.post
第三个外部高度.entry-meta =第三个.post
...

Answer 1

你必须遍历.post元素并适当地设置它们的最小高度

$('.post').each(function(){
   $(this).css('min-height', $('.entry-meta', this).outerHeight());
});

http://jsfiddle.net/4F7c9/2/

jquery将绝对子级的高度设置为父级

1 个答案: