css - div 中心和底部的按钮

Question

如何让一个按钮同时位于div的底部和中心？

.Center {
  width: 200px;
  height: 200px;
  background: #0088cc;
  margin: auto;
  padding: 2%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.btn-bot {
  position: absolute;
  bottom: 0px;
}

<div class=Center align='center'>
  <button class='btn-bot'>Bottom button</button>
</div>

Answer 1

给父元素...

display: table; text-align: center;

……及其子元素……

display: table-cell; vertical-align: bottom;

这样您就不需要知道子元素的宽度以防它发生变化，因此不需要负边距或变通方法。