Buttons in the footer

assets/styles/scss/demo.scss

@@ -100,21 +100,31 @@ div#sholo-popover-item {
   .sholo-popover-footer {
     display: block;
     clear: both;
+    margin-top: 5px;
+
     a {
       display: inline-block;
       padding: 3px 10px;
       border: 1px solid #d4d4d4;
       text-decoration: none;
       text-shadow: 1px 1px 0 #fff;
-      color: #333;
+      color: #2d2d2d;
       font: 11px/normal sans-serif;
       cursor: pointer;
       outline: 0;
-      background-color: #ececec;
+      background-color: #f1f1f1;
       border-radius: 2px;
       zoom: 1;
       margin: 10px 0 0;
     }
+
+    .sholo-close {
+      float: left;
+    }
+
+    .sholo-btn-group {
+      float: right;
+    }
   }
 
   .sholo-popover-title {

index.html

@@ -14,10 +14,10 @@
   <div class="sholo-popover-title">Did you know?</div>
   <div class="sholo-popover-description">You can make step by step introductions with sholo!</div>
   <div class="sholo-popover-footer">
-    <a href="javascript:void(0)">Close</a>
+    <a href="javascript:void(0)" class="sholo-close">Close</a>
     <span class="sholo-btn-group">
-      <a href="javascript:void(0)">Previous</a>
-      <a href="javascript:void(0)">Next</a>
+      <a href="javascript:void(0)">&larr; Previous</a>
+      <a href="javascript:void(0)">Next &rarr;</a>
     </span>
   </div>
 </div>