<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<div id="console"></div>
<span id="container"></span>
<span id="reference"><div></div><span>1,</span><span>2,</span><span>3,</span><div></div></span>
<script>
description('You should see two lines, both with 1,2,3.');
var last;
function insert(tagName, id)
{
last = container.insertBefore(document.createElement(tagName), last);
if (id)
last.id = id;
getComputedStyle(last).color; // attach.
return last;
}
var container = document.getElementById('container');
var div = container.appendChild(document.createElement('div'));
getComputedStyle(div).color; // attach.
// This inserts the elements in the reverse order they appear in the DOM
// calling layout()
insert('div');
insert('span', 3).textContent = '3,';
insert('span', 2).textContent = '2,';
insert('span', 1).textContent = '1,';
shouldBeGreaterThanOrEqual("document.getElementById('3').offsetLeft", "document.getElementById('2').offsetLeft");
shouldBeGreaterThanOrEqual("document.getElementById('2').offsetLeft", "document.getElementById('1').offsetLeft");
</script>