<h2 style="border-bottom: 1px solid gray;">What is 'M Height'?</h2>
<h4 style="background-color: #E5E5E5; padding: 6px;">Overview</h4>
<p>M Height is a reference value you can set to make letters, numbers, words,
<br/> or phrases <b><i>in the same font</i></b> proportional to each other.</p>
<img src="http://www.wordsanywhere.com/images/m-height-first-illustration.png" />
<h4 style="background-color: #E5E5E5; padding: 6px;">Detailed Explanation</h4>
<p>Consider all the upper and lower case letters of the corsiva font shown below.
Now ask yourself, "How tall is this lettering?" </p>
<img src="http://www.wordsanywhere.com/images/m%20height%20illus%201.png" alt="Corsiva Alphabet" />
<p>Each letter is a different size...so which should define the lettering height? </p>
<img src="http://www.wordsanywhere.com/images/m%20height%20illus%202.png" />
<p>Should it be 7.13" like the 'G', or possibly 6.24" like the capital 'R'? Maybe it's 3.6" like the 'e'. To add to the confusion the lower case 'j' at 7.43" is taller than the capital 'G'!</p>
<p>Due to size variations between characters in the same font at the same size, when referring to 'vinyl letter height' a common reference point is needed. </p>
<p>We've chosen one letter to be the reference point for all the other characters. The capital M. </p>
<img src="http://www.wordsanywhere.com/images/m%20height%20illus%203.png" />
<p>In this example the entire alphabet shown above is proportional to a 5.49" capital M. </p>
<p>By setting the M Height the same for each phrase, we can make two phrases </p>
<img src="http://www.wordsanywhere.com/images/m%20height%20illus%204.png" />
<p>match each other in size even though their actual measured heights are different. </p>
<p>Every character in each of the two phrases is exactly proportional to a 5.49" tall 'M' and thus they're proportional to each other....
Please Whitelist JSFiddle in your content blocker.
Help keep JSFiddle free for always by one of two ways:
Whitelist JSFiddle in your content blocker (two clicks)
Go PRO and get access to additional PRO features →
Join the 4+ million users, and keep the JSFiddle dream alive.
Ad-free
All ads in the editor and listing pages are turned completely off.
Use pre-released features
You get to try and use features (like the Palette Color Generator) months before everyone else.
Fiddle collections
Sort and categorize your Fiddles into multiple collections.
Private collections and fiddles
You can make as many Private Fiddles, and Private Collections as you wish!
Console
Debug your Fiddle with a minimal built-in JavaScript console.