No margin collapsing with table inside div

by Alessandro Vernet

HTML

<div class="outer">
  <div class="inner"><table></table></div>
  <div class="inner"><table></table></div>
  <div class="inner"><table></table></div>
  <div class="inner"><table></table></div>
</div>

CSS

.outer { border: 1px solid orange }
.inner { margin-bottom: 20px }
table { display: block }