html - 将按钮定位在“绝对”的底部

Question

我知道在 div 的底部放置一个按钮是将按钮设置为“绝对”并放置在“相对”的 div 中。

但是，我在表单中使用“隐藏可见性”attr，我需要将 div 设置为绝对。我的问题是如何在绝对 div 中设置按钮？

例如：http: //jsfiddle.net/khongming/Aa7Ur/

.abc{
   width: 300px;
   height: 180px;
   background-color: #ff6700;
   float: left;
   position: relative;
}
.page{
   visibility: hidden;
   position:absolute;
}

.continue {
    position: absolute;
    right: 10px;
    bottom: 10px;
}

谢谢你。

Answer 1

在课堂上添加width:100%and似乎可以解决问题。height:100%.page

http://jsfiddle.net/Aa7Ur/1/

Answer 2

将以下内容添加到 .page css：

height: 100%;
width: 100%;

如果您向 .page 和 .abc 添加 1px 边框（不添加上述内容），您会发现您没有用 .page 填充 .abc 的区域，因此将“底部”定位到底部.page，但不在.abc 的底部。通过如上所述设置尺寸，页面填充（相对）父 div .abc 您然后从相同尺寸定位，因此您的位置是正确的。