chriscoyier · January 9, 2012 03:25
diff --git a/dabblet.css b/dabblet.css
 /*
   Loading dot dot dot
 */

 body {
  padding: 100px;
  font-size: 62.5%;
 }

 .loading {
   font: 16px Monaco; /* no fallback cuz spacing would probably be off... */
   width: 6.1em; /* Was hoping 1 char = 1 em but didn't work out quite */
   overflow: hidden;
   animation: dotdotdot linear 1s infinite;
 }

 @keyframes dotdotdot {
  0% { width: 4.5em; }
  75% { width: 6.1em; }
 }

diff --git a/dabblet.html b/dabblet.html



 <div class="loading">
   Loading...
 </div>
diff --git a/settings.json b/settings.json
 {"view":"split-vertical","prefixfree":"1","page":"css"}
	/*
	Loading dot dot dot
	*/

	body {
	padding: 100px;
	font-size: 62.5%;
	}

	.loading {
	font: 16px Monaco; /* no fallback cuz spacing would probably be off... */
	width: 6.1em; /* Was hoping 1 char = 1 em but didn't work out quite */
	overflow: hidden;
	animation: dotdotdot linear 1s infinite;
	}

	@keyframes dotdotdot {
	0% { width: 4.5em; }
	75% { width: 6.1em; }
	}