Chrome Zoom issue: absolute Div top position changed while zoom ( Ctrl + ) - html

Question

I have problem with absolute positioning DIV over the table element. I have a DIV that’s set the position absolute and set the top position to display the exact place. Now what happened in chrome browser while zooming (ctrl +) the DIV position has been changed at zoom level 125, 150, 175 ... etc. But Zoom level 100,200, 300… (Multiple of 100) it’s displayed the same position. The problem was other than the multiple of 100 zoom level the DIV position changed. How can I fix this issue ?
I have created the sample page in jsfiddle . please run the page in chrome browser and zoom the browser ( ctrl + ) the red color DIV position will be change, this is the issue. I really hope some one find a solution for this.
HTML :
<table width="700px" class="custom">
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
<div>
<div class="apptest">
</div>
</div>
CSS :
table
{
border-collapse:collapse;
}
.custom tr td
{
height:20px;
border:1px solid;
background-color:White;
}
.apptest
{
height:70px;
width:400px;
position:absolute;
top:239px;
left:10px;
background-color:Red;
}

Answer 1

The only thing I can suggest that should maintain the same appearance under zoom is to have your table and your "apptest" div in the same container:
<div class="container">
<table class="custom">...</table>
<div class="apptest"></div>
</div>
See the fiddle: http://jsfiddle.net/mJcsb/4/
You're at a mercy of a completely proprietary algorithm though (Chrome's Zoom algorithm) so any irregularities in layout under zoom are completely possible.