Browser margin-top behavior

Look in Firebug, how the body gets pulled down.

by Andreas Burg

HTML

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

CSS

html {
  height: 100%;
}
body {
  background: #161514;
  height: 100%;
  margin: 0;
}
.outer {
  background: red;
  margin-top: 100px;
  min-height: 100px;
}
.inner {
  background: none yellow;
  margin-top: 100px;
  min-height: 50px;
}