<!DOCTYPE html>
<html>
<head>
<style>
.test > div { display: inline-block; overflow: hidden; white-space: nowrap; padding: 0 1px; vertical-align: top; }
.test > .ellipsis { text-overflow: ellipsis; }
</style>
</head>
<body>
<div class="test" style="zoom: 0.5;">
<div class="ellipsis">Should not be truncated</div><br>
<div class="expected">Should not be truncated</div>
</div>
<div class="test" style="zoom: 0.66;">
<div class="ellipsis">Should not be truncated</div><br>
<div class="expected">Should not be truncated</div>
</div>
<div class="test" style="zoom: 0.75;">
<div class="ellipsis">Should not be truncated</div><br>
<div class="expected">Should not be truncated</div>
</div>
<div class="test" style="zoom: 0.9;">
<div class="ellipsis">Should not be truncated</div><br>
<div class="expected">Should not be truncated</div>
</div>
<div class="test" style="zoom: 1.0;">
<div class="ellipsis">Should not be truncated</div><br>
<div class="expected">Should not be truncated</div>
</div>
<div class="test" style="zoom: 1.1;">
<div class="ellipsis">Should not be truncated</div><br>
<div class="expected">Should not be truncated</div>
</div>
<div class="test" style="zoom: 1.25;">
<div class="ellipsis">Should not be truncated</div><br>
<div class="expected">Should not be truncated</div>
</div>
<div class="test" style="zoom: 1.33;">
<div class="ellipsis">Should not be truncated</div><br>
<div class="expected">Should not be truncated</div>
</div>
<p>
None of the lines above should be truncated.
</p>
</body>
</html>