<!DOCTYPE html>
<style>
#container {
    overflow: auto;
    font: 10px Ahem;
}
#replaced {
    display: inline-block;
}
</style>
<script src="../../resources/check-layout.js"></script>
<p> crbug.com/573055: There should be no scrollbars below. </p>
<div id='container' data-expected-height=16>
    <div id="replaced" style="padding: 3.23px">Text</div>
</div>

<!-- Div below was added to stop pixel snapping from failing this test. -->
<div style="height: 0.57px"></div>

<div id='container' data-expected-height=17>
    <div id="replaced" style="padding: 3.73px">Text</div>
</div>
<div id='container' data-expected-height=18>
    <div id="replaced" style="padding: 3.77px">Text</div>
</div>
<script>
    checkLayout("#container");
</script>