Deliberable 2.1 - version 1.5

client/bundle.js

@@ -339,9 +339,12 @@
 	  this.element.innerHTML=
 	  '<div id="paginationWg">\
 	  <div id="resultsNr" style="text-align: center; font-size: 20px; padding-bottom: 24px">No results</div>\
-	  <button class="prev" disabled> &lt;&lt; PREVIOUS RESULTS</button>\
-	  <span>PAGE</span>\
-	  <button class="next" disabled>NEXT RESULTS &gt;&gt;</button></div>\
+	  <div id="pagControl" >\
+	    <button class="prev" disabled> &lt;&lt; PREV. RESULTS</button>\
+	    <span>PAGE</span>\
+	    <button class="next" disabled>NEXT RESULTS &gt;&gt;</button></div>\
+	    <div style="clear: both;"></div>\
+	  </div>\
 	    <table>  <thead> \
 	      <th>Formula</th> \
 	      <th>Number of Atoms</th> \

client/css/styles.css

@@ -161,8 +161,6 @@ tr:nth-child(odd) td { background: #FEFEFE; }
 /*tr td:hover { background: #666; color: #FFF; }  Hover cell effect! */
 
 
-
-
 #elementable{width:690px;  margin:60px auto 80px;}
 #elementable div.row{}
 #elementable div.cellpad{ display: inline-block;}
@@ -173,14 +171,15 @@ tr:nth-child(odd) td { background: #FEFEFE; }
 
 #resultset{ display: none}
 
-#paginationWg button{ border: none; width: 40%; color: #20335D; background-color: white;
-  padding: 16px 20px;cursor: pointer; font-size: 1.1em; font-weight: bold;
+#paginationWg button{  border: none; color: #20335D; background-color: white;
+  cursor: pointer; font-size: 1.1em; font-weight: bold;
 
 }
-#paginationWg button.prev{text-align: left;}
-#paginationWg button.next{text-align: right;}
+#pagControl{text-align:center; padding: 14px 0;}
+#paginationWg button.prev{float: left;}
+#paginationWg button.next{float: right;}
 
 #paginationWg button:disabled{ color: #CCC;cursor: default;}
-#paginationWg span{ display: inline-block; text-align: center; width: 19%;}
+#paginationWg span{ display:inline-block;   margin:0 auto !important;   }
 /*#paginationWg  .left { float: left }
 #paginationWg  .right { float: right }*/

client/src/ui/resultset.js

@@ -19,9 +19,12 @@ ResultSet.prototype._init = function() {
   this.element.innerHTML=
   '<div id="paginationWg">\
   <div id="resultsNr" style="text-align: center; font-size: 20px; padding-bottom: 24px">No results</div>\
-  <button class="prev" disabled> &lt;&lt; PREVIOUS RESULTS</button>\
-  <span>PAGE</span>\
-  <button class="next" disabled>NEXT RESULTS &gt;&gt;</button></div>\
+  <div id="pagControl" >\
+    <button class="prev" disabled> &lt;&lt; PREV. RESULTS</button>\
+    <span>PAGE</span>\
+    <button class="next" disabled>NEXT RESULTS &gt;&gt;</button></div>\
+    <div style="clear: both;"></div>\
+  </div>\
     <table>  <thead> \
       <th>Formula</th> \
       <th>Number of Atoms</th> \