<h1>Determining Aspect Value of a Font</h1>
<div class="letter-cover"><span>t</span><span class="adjusted-a">t</span></div>
<div class="letter-cover"><span>t</span><span class="adjusted-b">t</span></div>
<div class="letter-cover"><span>t</span><span class="adjusted-c">t</span></div>
<hr>
<div class="letter-cover"><span>b</span><span class="adjusted-a">b</span></div>
<div class="letter-cover"><span>b</span><span class="adjusted-b">b</span></div>
<div class="letter-cover"><span>b</span><span class="adjusted-c">b</span></div>
body {
text-align: center;
font-family: 'Lato';
font-weight: 300;
margin: 0 20px;
}
hr {
margin: 30px;
}
h1 {
margin-bottom: 40px;
}
span {
font-size: 8em;
border: 2px solid orange;
}
.letter-cover {
margin: 0px 20px;
display: inline-block;
}
.adjusted-a {
font-size-adjust: 0.4;
}
.adjusted-b {
font-size-adjust: 0.495;
}
.adjusted-c {
font-size-adjust: 0.6;
}
This Pen doesn't use any external JavaScript resources.