divider.scss in titon-toolkit-2.0.0.pre.rc.1

- old
+ new
@@ -1,46 +1,47 @@
 /**
- * @copyright   2010-2014, The Titon Project
+ * @copyright   2010-2015, The Titon Project
  * @license     http://opensource.org/licenses/BSD-3-Clause
  * @link        http://titon.io
  */
 
 @import "../common";
 
-.#{$vendor-prefix}divider {
-    position: relative;
+#{$divider-class} {
     text-align: center;
-    margin: $margin 0;
-    user-select: none;
     overflow: hidden;
-    clear: both;
-    min-height: 2px;
 
-    &:after,
-    &:before {
-        position: absolute;
-        content: " ";
-        width: 50%;
-        top: 50%;
-        margin-top: -1px;
+    &::after,
+    &::before {
+        content: "";
+        display: inline-block;
+        vertical-align: middle;
+        position: relative;
+        width: 100%;
         border-top: 1px solid black(.1);
         border-bottom: 1px solid white(.75);
     }
 
-    &:before {
-        left: 0;
-        margin-left: -1.5rem;
+    &::before {
+        margin-left: -100%;
+        left: -$margin;
     }
 
-    &:after {
-        right: 0;
-        margin-right: -1.5rem;
+    &::after {
+        margin-right: -100%;
+        right: -$margin;
     }
 
     // Collapse the middle when there is no content
     &:empty {
-        &:before,
-        &:after {
-            margin: -1px 0 0 0 !important;
+        &::before,
+        &::after {
+            right: 0;
+            left: 0;
         }
+    }
+
+    > span {
+        display: inline-block;
+        vertical-align: middle;
     }
 }
\ No newline at end of file