Width 100% is not working! My footer is going outside the `#wrap` and I don't want to set exact pixels to it.

Any solution?

[live example](http://jsfiddle.net/2P6KR/).

```css
#wrap {
  border: 1px solid #ccc;
  clear: both;
  display: table;
  vertical-align: middle;
  position: relative;
  width: 400px;
  margin: 0 auto 10px;
  padding: 10px;
}

footer {
  clear: both;
  background: #f3f3f3;
  border: 1px solid #ccc;
  border-radius: 5px;
  float: left;
  margin: 0;
  padding: 10px;
  width: 100%;
  overflow: auto;
  min-height: 100%;
  height: auto !important;
}
```

```html
<div id=wrap>
  <footer>&copy; 2013 PUAction&nbsp;&middot;&nbsp;<a href="#">Terms</a>&nbsp;&middot;&nbsp;<a href="#">Disclaimer</a>&nbsp;&middot;&nbsp;<a href="#">Privacy</a>&nbsp;&middot;&nbsp;<a href="#">Login</a></footer>
</div>
```