<!DOCTYPE html>
<script src="resources/text-based-repaint.js"></script>
<script>
  function repaintTest()
  {
    document.getElementById('remove').style.display='none';
  }
  onload = runRepaintTest;
</script>
<style>
#wrapper {
  visibility: hidden;
  position: absolute;
  width: 600px;
  float: right;
}
#container { float: right; }
#abs_pos {
  position: absolute;
  bottom: 0;
}
#remove_child,
#keep_child {
  height: 100px;
  width: 100px;
  visibility: visible;
}
#remove_child {
  background-color: red;
  position: absolute;
}
#keep_child { background-color: green; }
.outer {
  float: left;
  width: 100px;
  height: 300px;
}
#keep_inner {
  position: relative;
  height: 220px;
}
p { visibility: visible; }
</style>

<p>This is a reduction for http://crbug.com/371640.</p>
<p>The test PASSES if you see 1 green square and no red square.</p>

<div id='wrapper'>
 <div id='container'>
  <div id='keep_outer' class='outer'>
   <div id='keep_inner'>
    <div id='abs_pos'>
     <div id='keep_child'> </div>
    </div>
   </div>
  </div>
  <div  id='remove' class='outer'>
    <div id='remove_child'> </div>
  </div>
 </div>
</div>