Created
June 2, 2011 22:29
-
-
Save richardscarrott/1005474 to your computer and use it in GitHub Desktop.
font-size unit comparisons
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<title>Font-size unit comparisons</title> | |
<style type="text/css"> | |
* { | |
margin: 0; | |
padding: 0; | |
} | |
body { | |
font-family: arial, sans-serif; | |
} | |
div { | |
border: 1px solid #000; | |
padding: 10px; | |
margin: 0 0 10px; | |
} | |
#px { | |
font-size: 16px; | |
} | |
#pt { | |
font-size: 12pt; | |
} | |
#em { | |
font-size: 1em; | |
} | |
#percent { | |
font-size: 100%; | |
} | |
</style> | |
</head> | |
<body> | |
<div id="px"> | |
<p><del>Karl Pilkington's got a head like a Fucking Orange! - px</del></p> | |
</div> | |
<div id="pt"> | |
<p><del>Karl Pilkington's got a head like a Fucking Orange! - pt</del></p> | |
</div> | |
<div id="em"> | |
<p>Karl Pilkington's got a head like a Fucking Orange! - em</p> | |
</div> | |
<div id="percent"> | |
<p>Karl Pilkington's got a head like a Fucking Orange! - %</p> | |
</div> | |
<img src="http://www.google.co.uk/images/nav_logo72.png" alt="Check we're not zooming" /> | |
<p>Image added to help ensure fonts are being scaled not zoomed.</p> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment