diff --git a/index.html b/index.html
index 69de8bc..9b5e2b6 100644
--- a/index.html
+++ b/index.html
@@ -88,7 +88,7 @@
 			}
 
 			window.onload = function() {
-				demo('demo5', 'middle', 'middle');
+				demo('demo5', 'center', 'center');
 			};
 		</script>
 
@@ -104,19 +104,19 @@
 
 
 				<div class="button" id="demo1" onclick="demo('demo1', 'top', 'left');">top left</div>
-				<div class="button" id="demo2" onclick="demo('demo2', 'top', 'middle');">top middle</div>
+				<div class="button" id="demo2" onclick="demo('demo2', 'top', 'center');">top center</div>
 				<div class="button" id="demo3" onclick="demo('demo3', 'top', 'right');">top right</div>
 
 				<br/>
 
-				<div class="button" id="demo4" onclick="demo('demo4', 'middle', 'left');">middle left</div>
-				<div class="button active" id="demo5" onclick="demo('demo5', 'middle', 'middle');">middle middle</div>
-				<div class="button" id="demo6" onclick="demo('demo6', 'middle', 'right');">middle right</div>
+				<div class="button" id="demo4" onclick="demo('demo4', 'center', 'left');">center left</div>
+				<div class="button active" id="demo5" onclick="demo('demo5', 'center', 'center');">center center</div>
+				<div class="button" id="demo6" onclick="demo('demo6', 'center', 'right');">center right</div>
 
 				<br/>
 
 				<div class="button" id="demo7" onclick="demo('demo7', 'bottom', 'left');">bottom left</div>
-				<div class="button" id="demo8" onclick="demo('demo8', 'bottom', 'middle');">bottom middle</div>
+				<div class="button" id="demo8" onclick="demo('demo8', 'bottom', 'center');">bottom center</div>
 				<div class="button" id="demo9" onclick="demo('demo9', 'bottom', 'right');">bottom right</div>