fixed bottom navbar and horizontal scrollbar

static/css/main.css

@@ -14,6 +14,8 @@ body{
 	width: 100%;
 	top:0;
 	left: 0;
+  margin: 0;
+  padding: 0;
 }
 
 h1{
@@ -143,20 +145,32 @@ width: 40%;
 	display: block;
 }
 
-nav#bottom_descrip_left, nav#bottom_descrip_right {
-    width: 100%;
-		margin: 0;
-	  padding: 0;
-    height: auto;
-    z-index: 1000;
-    bottom: 0px;
-    text-transform: uppercase;
-    font-size: 15px;
-    line-height: 18px;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-	  list-style-type: none;
-	  overflow: hidden;
+nav.nav_bottom {
+  width: 100%;
+  margin: 0;
+  padding: 0;
+  height: auto;
+  z-index: 1000;
+  bottom: 0px;
+  text-transform: uppercase;
+  font-size: 15px;
+  line-height: 18px;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  list-style-type: none;
+  overflow: hidden;
+}
+
+nav.nav_bottom div li {
+  margin-right: 2em;
+}
+
+nav.nav_bottom div li:first-child {
+  margin-right: 0;
+}
+
+div#bottom_descrip_left, div#bottom_descrip_right {
+
 }
 
 

templates/description.html

@@ -70,15 +70,15 @@
 
 
 
-<div class="nav_bottom">
-<nav id="bottom_descrip_left">
-  <li class="index"><a href="/">index</a></li>
+<nav class="nav_bottom">
+  <div id="bottom_descrip_left">
+    <li class="index"><a href="/">index</a></li>
+  </div>
+
+  <div id="bottom_descrip_right">
+    <li class="next_item"><a href={{addressplus}}>next item</a></li>
+    <li class="prev_item"><a href={{addressminus}}>previous item</a></li>
+    <li class="no_here">{{itemid}}/31</li>
+  </div>
 </nav>
-
-<nav id="bottom_descrip_right">
-  <li class="no_here">{{itemid}}/31</li>
-  <li class="prev_item"><a href={{addressminus}}>previous item</a></li>
-  <li class="next_item"><a href={{addressplus}}>next item</a></li>
-</nav>
-</div>
 {% endblock %}