From e1f8e9ba1f0097ce1eba004da061b5bd293b74d0 Mon Sep 17 00:00:00 2001
From: Jeremy Thomas <bbxdesign@gmail.com>
Date: Sun, 2 Apr 2017 14:37:10 +0100
Subject: [PATCH] Fix #578

---
 CHANGELOG.md               |  1 +
 docs/css/bulma-docs.css    |  6 ++----
 sass/utilities/mixins.sass | 12 +++++++-----
 3 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3054246e..a2cd2ffb 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,6 +9,7 @@
 # Fix #607 has-addons z-index
 # Feature #586 select color modifiers
 # Fix #537 -ms-expand
+# Fix #578 better `+center` mixin
 
 ## 0.4.0
 
diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css
index 5b5e9a56..c2de947f 100644
--- a/docs/css/bulma-docs.css
+++ b/docs/css/bulma-docs.css
@@ -1666,11 +1666,9 @@ a.box:active {
   height: 1em;
   position: relative;
   width: 1em;
-  left: 50%;
-  margin-left: -0.5em;
-  margin-top: -0.5em;
   position: absolute;
-  top: 50%;
+  left: calc(50% - (1em / 2));
+  top: calc(50% - (1em / 2));
   position: absolute !important;
 }
 
diff --git a/sass/utilities/mixins.sass b/sass/utilities/mixins.sass
index 1c1fd308..8ac340c7 100644
--- a/sass/utilities/mixins.sass
+++ b/sass/utilities/mixins.sass
@@ -20,12 +20,14 @@
     content: " "
     display: table
 
-=center($size)
-  left: 50%
-  margin-left: -($size / 2)
-  margin-top: -($size / 2)
+=center($width, $height: 0)
   position: absolute
-  top: 50%
+  @if $height != 0
+    left: calc(50% - (#{$width} / 2))
+    top: calc(50% - (#{$height} / 2))
+  @else
+    left: calc(50% - (#{$width} / 2))
+    top: calc(50% - (#{$width} / 2))
 
 =delete
   +unselectable