diff --git a/public/resources/css/main.scss b/public/resources/css/main.scss
index 27b87b088d..0a0e019eab 100644
--- a/public/resources/css/main.scss
+++ b/public/resources/css/main.scss
@@ -54,6 +54,7 @@
 @import 'module/press-kit';
 @import 'module/features';
 @import 'module/docs-landing';
+@import 'module/copy';
 
 /*
 * PRINT STYLES
diff --git a/public/resources/css/module/_copy.scss b/public/resources/css/module/_copy.scss
new file mode 100644
index 0000000000..b1a295c96a
--- /dev/null
+++ b/public/resources/css/module/_copy.scss
@@ -0,0 +1,10 @@
+.copy-container-template {
+  position: relative;
+
+  & > .copy-button {
+    margin-top: 8px;
+    right: 0;
+    z-index: 1;
+    position: absolute;
+  }
+}
\ No newline at end of file
diff --git a/public/resources/js/directives/copy.js b/public/resources/js/directives/copy.js
index a2abd8bb96..f35bb151f5 100644
--- a/public/resources/js/directives/copy.js
+++ b/public/resources/js/directives/copy.js
@@ -24,8 +24,8 @@ angularIO.directive('copyContainer', function() {
     restrict: 'E',
     transclude: true,
     template:
-      '<div style="position: relative; overflow: auto;">' +
-        '<copy-button style="position: absolute; top: 18px; right: 0px; z-index: 1" ></copy-button>' +
+      '<div class="copy-container-template">' +
+        '<copy-button class="copy-button"></copy-button>' +
         '<ng-transclude></ng-transclude>' +
       '</div>'
   };