| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Spanner between rows, margins</title> |
| </head> |
| <body> |
| <p>There should be a blue square below.</p> |
| <!-- A bottom margin preceding the spanner shouldn't bleed through the spanner and be |
| applied to content following the spanner. --> |
| <div style="margin:20px; -webkit-columns:4; columns:4;"> |
| <div style="width:10em; height:1em; -webkit-column-break-inside:avoid; break-inside:avoid; margin-bottom:7em;"></div> |
| <div style="-webkit-column-span:all; column-span:all; width:6em; height:3em; background:blue;"></div> |
| <div style="width:6em; height:3em; -webkit-column-break-inside:avoid; break-inside:avoid; background:blue;"></div> |
| </div> |
| </body> |
| </html> |
