font-size-fractional.html | Explore in Territory

<!DOCTYPE HTML>
<script src="../../resources/js-test.js"></script>
<style> 
body         {font-size: 12px;}
#control     {font: normal 400 80%/2.5 sans-serif;}
#calc-reduce {font: normal 400 calc(80%)/2.5 sans-serif;}
</style>

<div id="test-container">
<span id="control">The font size and line height of these lines should be identical</span>
<hr/>
<span class="fonttest" id="calc-reduce">The font size and line height of these lines should be identical</span>
</div>
<hr/>

<script>
description("Tests that CSS3 calc() can be used with the font property using fractional sizes");

var spans = document.getElementsByClassName("fonttest");
for (var i = 0; i < spans.length; ++i) {
    var current = spans[i];
    shouldBeEqualToString('getComputedStyle(document.getElementById("' + current.id + '"), null).lineHeight', getComputedStyle(document.getElementById("control"), null).lineHeight);
    shouldBeEqualToString('getComputedStyle(document.getElementById("' + current.id + '"), null).fontSize', getComputedStyle(document.getElementById("control"), null).fontSize);
}

if (window.testRunner)
    document.body.removeChild(document.getElementById("test-container"));
</script>
chromium/third_party/blink/web_tests/css3/calc/font-size-fractional.html
