Closed
Description
Zoom has some interesting behavior that makes no sense to me (live):
<!doctype html>
<div style="font-size: 16px; width: 100px; line-height: 16px;">
<div style="background-color: green; font-size: inherit; line-height: inherit; width: inherit; height: 100px; zoom: 2;">What size am I?</div>
</div>That for some reason ends up with:
line-heightof16pxfont-sizeof32pxwidthof100pxheightof200px
That just makes no sense. This happens because the way zoom is implemented in browsers is by mutating the computed value, so inheritance doesn't account for zoom since it copies the un-zoomed computed value.
But then somehow font-size (but not line-height) is special, and gets recomputed on zoom changes??