make the pages look not so bad on my wifes ipad

assets/html/author.html

@@ -19,18 +19,18 @@
 					<div class="right">
 						<h1>Rambler</h1>
 					</div>
-					<div class="clear"></div>
 				</a>
 			</div>
 
 			<div id="menu">
 				<ul>
-					<li>&nbsp;</li>
+					<li class="menuedge"></li>
 					<li><a href="/author.html">author</a></li>
 					<li><a href="/documentation.html">documentation</a></li>
 					<li><a href="/download.html">download</a></li>
 					<li><a href="/example.html">example</a></li>
-					<li>&nbsp;</li>
+					<li class="menuedge"></li>
+					<div></div>
 				</ul>
 				<div class="clear"></div>
 			</div>

assets/html/documentation.html

@@ -19,18 +19,18 @@
 					<div class="right">
 						<h1>Rambler</h1>
 					</div>
-					<div class="clear"></div>
 				</a>
 			</div>
 
 			<div id="menu">
 				<ul>
-					<li>&nbsp;</li>
+					<li class="menuedge"></li>
 					<li><a href="/author.html">author</a></li>
 					<li><a href="/documentation.html">documentation</a></li>
 					<li><a href="/download.html">download</a></li>
 					<li><a href="/example.html">example</a></li>
-					<li>&nbsp;</li>
+					<li class="menuedge"></li>
+					<div></div>
 				</ul>
 				<div class="clear"></div>
 			</div>

assets/html/download.html

@@ -19,18 +19,18 @@
 					<div class="right">
 						<h1>Rambler</h1>
 					</div>
-					<div class="clear"></div>
 				</a>
 			</div>
 
 			<div id="menu">
 				<ul>
-					<li>&nbsp;</li>
+					<li class="menuedge"></li>
 					<li><a href="/author.html">author</a></li>
 					<li><a href="/documentation.html">documentation</a></li>
 					<li><a href="/download.html">download</a></li>
 					<li><a href="/example.html">example</a></li>
-					<li>&nbsp;</li>
+					<li class="menuedge"></li>
+					<div></div>
 				</ul>
 				<div class="clear"></div>
 			</div>

assets/html/example.html

@@ -23,15 +23,17 @@
 					<div class="right">
 						<h1>Rambler</h1>
 					</div>
-					<div class="clear"></div>
 				</a>
 			</div>
 
 			<div id="menu">
 				<ul>
+					<li class="menuedge"></li>
 					<li><span>random Value</span></li>
 					<li><span>start session</span></li>
 					<li><span>login</span></li>
+					<li class="menuedge"></li>
+					<div></div>
 				</ul>
 			</div>
 

assets/html/main.html

@@ -19,20 +19,19 @@
 					<div class="right">
 						<h1>Rambler</h1>
 					</div>
-					<div class="clear"></div>
 				</a>
 			</div>
 
 			<div id="menu">
 				<ul>
-					<li>&nbsp;</li>
+					<li class="menuedge"></li>
 					<li><a href="/author.html">author</a></li>
 					<li><a href="/documentation.html">documentation</a></li>
 					<li><a href="/download.html">download</a></li>
 					<li><a href="/example.html">example</a></li>
-					<li>&nbsp;</li>
+					<li class="menuedge"></li>
+					<div></div>
 				</ul>
-				<div class="clear"></div>
 			</div>
 
 			<div id="main">

assets/style/taskrambler.css

@@ -145,10 +145,15 @@ div.border div.br {
 
 #title {
 	width:        677px;
+	height:       120px;
 	margin-left:  auto;
 	margin-right: auto;
 }
 
+#title a {
+	text-decoration: none;
+}
+
 #title div {
 	float:    left;
 	height:   100px;
@@ -186,26 +191,43 @@ div.border div.br {
 
 #menu {
 	text-align:     center;
-	width:      100%;
+	margin:         0px;
 }
 
 #menu ul {
 	display:          inline-block;
+	width:            750px;
+	height:           40px;
 	list-style:       none;
 	padding:          0px;
+	margin:           0px;
+	text-align:       justify;
+	text-justify:     distribute-all-lines;
+	background-color: rgb(42,44,40);
 }
 
 #menu ul li {
-	float:            left;
-	padding:          10px 34px;
+	display:        inline-block;
 	font-family:    old_newspaper;
 	font-size:      20px;
-	background-color: rgb(42,44,40);
 	color:          rgb(255,253,200);
 }
 
+#menu ul li.menuedge {
+	width: 50px;
+	vertical-align: center;
+}
+
+#menu ul div {
+	width: 100%;
+	display: inline-block;
+	font-size: 0;
+	line-height: 0;
+}
+
 #menu ul li span {
 	cursor: pointer;
+	color:  rgb(255,253,200);
 }
 
 #menu ul li a {