Question: How to make a button be at the bottom of div and at the center of it at the same time?

```css
.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;
}
```

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

Answer: 
Give the parent element…

```
display: table; text-align: center;

```

…and its child element…

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

```

This way you do not need to know the width of the child element in case it changes, thus requiring no negative margins or workarounds.
For example write like this if you have position absolute:

```
.btn-bot{
   position:absolute; 
   margin-left:-50px;
   left:50%;
   width:100px;
   bottom:0px;
}

```

Note: give margin-left half of the width of the button.

[JSFiddle demo](http://jsfiddle.net/3QguR/12/)