diff --git a/src/definitions/elements/label.less b/src/definitions/elements/label.less
index ae45d3ae2..b65dc1b32 100755
--- a/src/definitions/elements/label.less
+++ b/src/definitions/elements/label.less
@@ -345,7 +345,7 @@ a.ui.label {
 .ui[class*="right ribbon"].label {
   text-align: left;
   transform: translateX(-100%);
-  left: ~"calc(100% + "@ribbonDistance~")";
+  left: @rightRibbonOffset;
   border-radius: @borderRadius 0em 0em @borderRadius;
   padding-left: @horizontalPadding;
   padding-right: @ribbonDistance;
diff --git a/src/themes/default/elements/label.variables b/src/themes/default/elements/label.variables
index 9d26603ea..703d8e34f 100644
--- a/src/themes/default/elements/label.variables
+++ b/src/themes/default/elements/label.variables
@@ -91,9 +91,10 @@
 
 /* Ribbon */
 @ribbonTriangleSize: 1.2em;
-@ribbonOffset: ~"calc(-1rem - "@ribbonTriangleSize~")";
-@ribbonDistance: ~"calc(1rem + "@ribbonTriangleSize~")";
-@ribbonMargin: 1em;
+@ribbonMargin: 1rem;
+@ribbonOffset: ~"calc("-@ribbonMargin~" - "@ribbonTriangleSize~")";
+@ribbonDistance: ~"calc("@ribbonMargin~" + "@ribbonTriangleSize~")";
+@rightRibbonOffset:  ~"calc(100% + "@ribbonMargin~" + "@ribbonTriangleSize~")";
 @ribbonShadowColor: rgba(0, 0, 0, 0.15);
 
 @blackRibbonShadow: darken(@black, 10);