<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<p>Test that a table-row child of an inline is wrapped inside an inline-table (and table-row-group).</p>
<span style="display:inline-block;">
<div id="first" style="display:table-row; color:blue; background:blue;"><div style="width:1em; height:1em;"></div></div>
There should be one blue box above and one below this line.
<div id="last" style="display:table-row; color:blue; background:blue;"><div style="width:1em; height:1em;"></div></div>
</span>
<div id="console"></div>
<script>
var firstBottom = document.getElementById('first').getClientRects()[0].bottom;
var lastTop = document.getElementById('last').getClientRects()[0].top;
shouldBeGreaterThan("lastTop", "firstBottom");
</script>