adjusted version for box-sizing

sass/_01-base.scss

@@ -8,9 +8,12 @@
 /* ----------------------------- */
 
 /* switching box model for all elements */
-* {
+html {
 	box-sizing: border-box;
 }
+*, *:before, *:after {
+	box-sizing: inherit;
+}
 
 /* soft reset */
 html,
@@ -55,24 +58,24 @@ svg:not(:root) {
 /* ----------------------------- */
 
 html {
-	
+
 	/* set base font-size to equiv "10px", which is adapted to rem unit */
 	font-size: 62.5%;
-	
+
 	/* IE9-IE11 math fixing. See http://bit.ly/1g4X0bX */
 	/* thanks to @guardian, @victorbritopro and @eQRoeil */
     font-size: calc(1em * 0.625);
-	
+
 	/* disallow text zooming on orientation change (non standard property) */
 	-webkit-text-size-adjust: 100%;
 	    -ms-text-size-adjust: 100%;
 }
 
 body {
-	
+
 	/* set body font-size in em (1.4em equiv "14px") */
 	font-size: ($base-font-size / 10px) + em;
-	
+
 	background-color: $base-background;
 	color: $base-color;
 	font-family: $font-stack-common;
@@ -99,7 +102,7 @@ th,
 label,
 textarea,
 caption,
-details, 
+details,
 figure {
 	margin-top: 0.75em;
 	margin-bottom: 0;
@@ -153,7 +156,7 @@ h6, .h6-like {
 	@include em($base-font-size / 1px + 6);
 }
 
-code, 
+code,
 pre,
 samp,
 kbd {
@@ -190,10 +193,10 @@ sup {
 /* ----------------------------- */
 
 /* hidden but not for assistance tools, Yahoo! method */
-.visually-hidden { 
+.visually-hidden {
 	position: absolute !important;
     border: 0 !important;
-    height: 1px !important; 
+    height: 1px !important;
     width: 1px !important;
     padding: 0 !important;
     overflow: hidden !important;
@@ -221,18 +224,18 @@ body > script {
 /* ----------------------------- */
 
 /* avoid top margins on first content element */
-p, 
-.p-like, 
-ul, 
-ol, 
+p,
+.p-like,
+ul,
+ol,
 dl,
-blockquote, 
+blockquote,
 pre,
-h1, 
-h2, 
-h3, 
-h4, 
-h5, 
+h1,
+h2,
+h3,
+h4,
+h5,
 h6 {
 	&:first-child {
 		margin-top: 0;
@@ -249,21 +252,21 @@ li ol {
 }
 
 /* max values */
-img, 
-table, 
-td, 
-blockquote, 
-code, 
-pre, 
-textarea, 
-input, 
+img,
+table,
+td,
+blockquote,
+code,
+pre,
+textarea,
+input,
 video {
 	max-width: 100%;
 }
 
 /* margin-bottom on tables */
-table { 
-	margin-bottom: $medium-value; 
+table {
+	margin-bottom: $medium-value;
 }
 
 
@@ -273,7 +276,7 @@ table {
 
 /* float layout */
 /* module, gains superpower "BFC" Block Formating Context */
-.mod { 
+.mod {
 	overflow: hidden;
 }
 
@@ -340,26 +343,26 @@ img.end {
 	margin-left: $small-value;
 }
 
-img.left, 
+img.left,
 img.right,
-img.start, 
+img.start,
 img.end {
 	margin-bottom: $tiny-value;
 }
 
-.center    { 
-	margin-left: auto; 
-	margin-right: auto; 
+.center    {
+	margin-left: auto;
+	margin-right: auto;
 }
 
-.txtleft   { 
-	text-align: left; 
+.txtleft   {
+	text-align: left;
 }
 
-.txtright  { 
-	text-align: right; 
+.txtright  {
+	text-align: right;
 }
 
-.txtcenter { 
-	text-align: center; 
+.txtcenter {
+	text-align: center;
 }