Question

我最近在与这些div挣扎。例如，请看下面的代码：

<div class="container">
{
    width: auto;
    height: auto;
}
    <div class="content">
    {
        width: auto;
        height: auto;
    }
        <div class="upload">
        {
            width: 400px;
            margin-left: 600px;
            position: absolute;
        }
        </div>
    </div>

    <div class="footer>

    </div>
</div>

首先是屏幕上实际显示的内容（不能更好地绘制）：

--------------------------------------
|               CONTAINER            |
|   _____________________________    |
|   [       CONTENT   = = = =  =]    |
|   [                 = UPLOAD =]    |
|   [                 =        =]    |
|   [                 =        =]    |
|   [                 =        =]    |
|   [                 =        =]    |
|   [                 =        =]    |
|   [                 =        =]    |
|   [                 =        =]    |
|   [                 =        =]    |
|   [                 = = = = = ]    |
|   [                           ]    |
|   [                           ]    |
|   [                           ]    |
|   [                           ]    |
|   [                           ]    |
|   [                           ]    |
|   [                           ]    |
|   [___________________________]    |
|   _____________________________    |
|   [          FOOTER           ]    |
|   [___________________________]    |
--------------------------------------

当类upload的高度变大时，由于绝对定位，它会漂浮在container和content div之外。

我需要找到一种方法来将此container或content的尺寸调整为upload div。

当我像这样设置上传类的样式时：

position: relative;
float: right;
padding-right: 500px;

它有效，但仅限于此分辨率。如果你放大，这个填充会弄乱content（左侧）和upload（右侧）。保持边缘 - 现在的状态是好的，因为upload div还剩下任何分辨率所需的最小空间。

所以任何人...... 有什么想法吗？

修改

有一秒钟我虽然拥有它。

如果您在我的案例中提供upload属性position: relative，则问题在于它会将内容中的所有内容推送到upload div ....

所以我将.upload替换为position: relative;并在content内添加了一个新的div（upload当然除外）

.insidecontent
{
float: left;
position: absolute;
top: 170px;
}

但现在content高度等于upload的高度，当它小于content或.insidecontent时，它会被切断。

对不起，我不能在jsfiddle中给出一个好的代码示例，它并没有真正显示我在网页上看到的内容。

Answer 1

你可以使用相对定位来帮助你。使用以下详细信息更新您的代码

.upload{
    width: 25%;
    position: relative;
    top: -24%;
    left: 69%;    
}

Sample Code

如何调整div的高度到它内部的绝对div的高度？

1 个答案: