为什么我的提交按钮位于其容器外？

Question

正如您在下面的图片中看到的那样，我的提交按钮（＆＃34; envoyer＆＃34;法语）被放置在其容器之外（容器具有红色背景并被称为.footer-content） 我还没有能够在jsfiddle上重新创建这个问题，所以这里是直接链接（我还没有能够使用firebug来识别问题）

.footer-content {
  position: relative;
  margin-right: auto;
  margin-left: auto;
  height: auto;
  clear: both;
  z-index: 9;
  max-width: 700px;
    background: red;
    margin-top: 40px;
}

Answer 1

因为你的配方师的位置是绝对的，而且它的容器高度是自动的（绝对定位的元素不会影响他们的父母身高）

将此CSS用于公式

#contactfrm {
    position: relative;
    float: left;
}

Answer 2

试试这个：

.footer-content {
    margin: 40px auto auto auto;
    width: 100%;
    max-width: 700px;
    height: auto;
    background: red;
    position: relative;
    clear: both;
    z-index: 9;
    overflow: auto;
}