| <!DOCTYPE html> |
| <style> |
| .container { |
| border: 1px solid black; /* stop margin collapsing across tests */ |
| margin-bottom: 30px; |
| } |
| |
| .margin { |
| margin-bottom: 10px; |
| width: 50px; |
| height: 50px; |
| background-color: blue; |
| } |
| |
| .out-of-flow { |
| position: absolute; |
| background: green; |
| height: 50px; |
| width: 50px; |
| } |
| |
| .flow { |
| background: red; |
| height: 50px; |
| width: 50px; |
| } |
| </style> |
| <div class=container> |
| <span> |
| <div class=margin></div> |
| <div class=out-of-flow></div> |
| <div class=flow></div> |
| </span> |
| </div> |
| |
| <div class=container> |
| <span> |
| <div class=margin></div> |
| <div class=out-of-flow></div> |
| </span> |
| <div class=flow></div> |
| </div> |
| |
| <div> |
| <span> |
| <div class=margin></div> |
| <div class=out-of-flow></div> |
| </span> |
| </div> |
| <div class=flow></div> |
