em-margin-border-padding.html | Explore in Territory

<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
html { font-size: 16px; }
body { width: 896px; margin: 0; overflow-y: hidden; }
</style>

<script src="resources/autosizingTest.js"></script>

</head>
<body>

<p style="margin: 1em; border: 1em solid blue; padding: 1em">
    This text should get autosized to 40px computed font size (16 * 800/320), but the 1em margins, borders and padding should remain just 16px. While debatable, this generally looks more consistent than having them be scaled.<br>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p>

</body>
</html>

chromium/third_party/blink/web_tests/fast/text-autosizing/em-margin-border-padding.html