Question

我遇到了一个问题，我在使用布局工具来调整大量div的大小。这些div具有标题范围，设置为bottom : 0。在缩短的div上，这些都很好，但是在延长的DIV上，它们漂浮在div的底部之上。

我已经尝试了各种CSS方法来使跨度坚持到底部，但似乎一旦渲染，然后freewall（布局脚本）有它的方式，跨度不是推倒了。

我试图通过各种方法获得父DIV的高度。当我登录div时，我可以看到它在element.style中的渲染高度（高度：222.4px）;然而，当我尝试访问该样式时，它只返回css应用的背景图像，而不是渲染的高度。通过jquery .height（）的任何尝试只返回CSS高度（200px），这是不正确的。

任何想法如何确保元素在布局大小调整后保持底部，或者如何访问渲染高度以便我可以以编程方式将其粘贴在底部？

这是CSS

.guideScene
{
    height :            200px;
    width :             200px;
    min-width :         190px;
    background-size:    cover; 
    background-repeat:  no-repeat;
    background-position: center;
    position:           absolute;

}


@media all and (max-width: 768px) {
    .guideScene {
        height :        100px;
    }
}

.guideScene span
{
    font-family:        'Lato', sans-serif;
    font-color :        #000;
    font-weight:        700;
    font-size:          14px;
    line-height:        100%;
    min-height:         14px;
    background:         #fff;
    padding:            4px 10px 4px 10px;
    bottom:             0px;
    width:              100%;
    position:           absolute;

}

在这里你去popNoodles：

        console.log( $(this.parentNode).outerHeight(true) );
        console.log( $(this.parentNode).height() );

或console.log( $(this.parentNode).attr('style') - 回显背景

        console.log(this.parentElement) gives me the data

这个属性在这里我试图访问！

enter image description here

Answer 1

.height()只给出了元素高度

.innerHeight()给出元素高度加上/下填充

.outerHeight(true)可能就是你要找的东西，因为它给出了元素高度，顶部/底部填充和边框加上如果设置为true则会添加边距

获得渲染的DIV高度

1 个答案: