Fix Radio and Checkbox positioning

2 files changed, 20 insertions, 18 deletions

diff --git a/src/components/Checkbox/Checkbox.module.scss b/src/components/Checkbox/Checkbox.module.scss
index 2957801..e0cbf1b 100644
--- a/src/components/Checkbox/Checkbox.module.scss
+++ b/src/components/Checkbox/Checkbox.module.scss
@@ -60,16 +60,16 @@
   position: relative;
   top: 1px;
   left: 1px;
-  width: rem(18);
-  height: rem(18);
+  width: 18px;
+  height: 18px;
   border: 1px solid color(gray, 6);
   border-radius: border-radius();
 }
 
 .Check {
   position: absolute;
-  top: rem(3);
-  left: rem(3);
+  top: 3px;
+  left: 3px;
   stroke-width: 3px;
   stroke: color(blue);
   fill: color(blue);
@@ -80,8 +80,9 @@
 
 .Label {
   position: absolute;
-  padding-left: rem(27);
-  padding-top: rem(4);
+  padding-left: 27px;
+  padding-top: 4px;
+  white-space: nowrap;
 }
 
 .Group {
@@ -93,9 +94,9 @@
 }
 
 .HelpText {
-  padding-top: rem(3);
+  padding-top: 3px;
   font-size: rem(13);
   line-height: rem(15);
   color: color(gray, 4);
-  padding-left: rem(27);
+  padding-left: 27px;
 }
diff --git a/src/components/Radio/Radio.module.scss b/src/components/Radio/Radio.module.scss
index f3b09a1..5de63ba 100644
--- a/src/components/Radio/Radio.module.scss
+++ b/src/components/Radio/Radio.module.scss
@@ -59,18 +59,18 @@
   position: relative;
   top: 1px;
   left: 1px;
-  width: rem(18);
-  height: rem(18);
+  width: 18px;
+  height: 18px;
   border: 1px solid color(gray, 6);
   border-radius: 50%;
 }
 
 .Fill {
   position: absolute;
-  top: rem(5);
-  left: rem(5);
-  width: rem(10);
-  height: rem(10);
+  top: 5px;
+  left: 5px;
+  width: 10px;
+  height: 10px;
   background: color(blue);
   border-radius: 50%;
 
@@ -80,8 +80,9 @@
 
 .Label {
   position: absolute;
-  padding-left: rem(27);
-  padding-top: rem(4);
+  padding-left: 27px;
+  padding-top: 4px;
+  white-space: nowrap;
 }
 
 .Group {
@@ -93,9 +94,9 @@
 }
 
 .HelpText {
-  padding-top: rem(3);
+  padding-top: 3px;
   font-size: rem(13);
   line-height: rem(15);
   color: color(gray, 4);
-  padding-left: rem(27);
+  padding-left: 27px;
 }