HTML强制div显示在div的底部

我有这个

在这里，我想在div1中显示一个图像，在这个div1下面，我还想在div2中显示一个提交按钮。这里的问题是，第二个div出现在第一个div的下面

第一部分我需要使用

position:absolute

---

学生2：我用实心边框来观察发生了什么

如果将第二个

div

放在第一个内会怎么样？毕竟，

div

s只是容器-重要的是按钮要放在图片下方。

如我前面所述，将提交按钮移动到

#容器

父块中：

<div id="container">
    <img src="http://31.media.tumblr.com/tumblr_m50exyThDb1r4kc3co1_500.jpg" />

    <div id="footerSubmit">
        <input type="submit" alt="Submit" id="SubmitSelections" name="Submit">
    </div>
</div>

---

否则，您必须在

#container

上设置一个高度，并在

#footerSubmit

上设置绝对或相对位置，这需要更多的工作…

如果您知道absolute元素/div的高度，则可以使用它的高度来定位相对元素。例如，将div2 css更改为

#footerSubmit{
        position:relative;
        top:350px;
        float:right;
        border: 10px solid;
        color:red;

    }

---

否则，将div2放在div1中，并将其定位为

bottom:0和<代码>浮动：右侧
请在此处包含相关代码，而不是链接到外部网站。如果外部网站改变或消失，这个问题就会失去上下文，变得毫无用处。人们不知道你的意思。非常不清楚。@CoKoder是否准备为图像容器指定高度值？或者，您想要JavaScript解决方案吗？@MarcAudet，不，我不准备为图像容器指定高度值。我想用css解决它。如果你想用css“解决它”，那么在
#footerSubmit
上使用绝对或相对定位……但是，如果我删除position:absolute，我就得到了我想要的。我怎样才能通过保持位置来获得同样的效果：绝对。您认为可能吗？您提到了javascript解决方案，在这种情况下，我也可以使用它。绝对定位元素从文档流中移除。在您的示例中，这意味着
#container
超出常规文档布局，这意味着它不知道
#footerSubmit
退出。同样，
#footerSubmit
也不知道
#容器
。因此，
#footerSubmit
位于页面顶部，因为它是流中的第一个元素。只有两种方法可以将页脚保持在图像下方，将它们都包装在同一父容器中（如我所示），或者为
#容器
指定一个高度，然后在
#footerSubmit
上使用相对或绝对位置。是否有方法检测#容器的高度，然后动态分配它？是，您可以使用JavaScript或jQuery获取
#container
的高度，然后使用该值定位
#footerSubmit
。