Skip to content

Instantly share code, notes, and snippets.

@bramstein

bramstein/word-spacing-transform.html

Created July 8, 2011 14:36
Show Gist options
  • Save bramstein/1071975 to your computer and use it in GitHub Desktop.
Save bramstein/1071975 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
word-spacing-transform.html
<!doctype html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style>
.example {
width: 3500px;
font-family: 'times new roman', 'FreeSerif', serif;
font-size: 140px;
line-height: 210px;
border: 10px solid red;
-webkit-transform-origin: top left;
-webkit-transform: scale(0.1);
}
.example span {
text-align: justify;
width: 3500px;
height: 210px;
display: inline-block;
}
</style>
</head>
<body>
<div class="example">
<span style="word-spacing: 22px;">In olden times when wishing still helped one, there lived a</span>
<span style="word-spacing: -2px;">king whose daughters were all beautiful; and the youngest was</span>
<span style="word-spacing: 12px;">so beautiful that the sun itself, which has seen so much, was</span>
<span style="word-spacing: 9px;">astonished whenever it shone in her face. Close by the king's</span>
<span style="word-spacing: 2px;">castle lay a great dark forest, and under an old lime-tree in the</span>
<span style="word-spacing: 0px;">forest was a well, and when the day was very warm, the king's</span>
<span style="word-spacing: 5px;">child went out to the forest and sat down by the fountain; and</span>
<span style="word-spacing: 1px;">when she was bored she took a golden ball, and threw it up on</span>
<span>high and caught it; and this ball was her favorite plaything.</span>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment