<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<style>
.grid { -webkit-line-grid: simple; -webkit-line-snap: baseline; 
        font-size:36px; position:absolute;
        padding:10px; }
</style>
</head>
<body>
<div style="left:10px; top:10px; width:600px" class="grid">
<div style="-webkit-line-snap:contain;font-size:48px">
This header should be centered in the grid lines.
</div>
<div style="font-size:12px">
This text should snap<br>
to a 36px font-size grid.<br>
There should be lots of spacing between these lines.

</div>
</div>

<div style="left:10px; top:10px; z-index:-1; width:600px" class="grid">
<div style="font-family:'Ahem'; color:lime">
xxxxxxxxxxxxxxxxx<br>
xxxxxxxxxxxxxxxxx<br>
xxxxxxxxxxxxxxxxx<br>
xxxxxxxxxxxxxxxxx<br>
xxxxxxxxxxxxxxxxx<br>
xxxxxxxxxxxxxxxxx<br>
xxxxxxxxxxxxxxxxx<br>
</div>
</div>

</body>
</html>