Fix to Chrome inheritance bug (#22872) (#23118)

* Fix to Chrome inheritance bug (#22872)

* Remove box-sizing from html

box-sizing removed from html and order of wild card selected and html selector swapped to maintain correctness of comments.

1 files changed, 6 insertions, 7 deletions

diff --git a/scss/_reboot.scss b/scss/_reboot.scss
index 9a6b025f6..e411e9215 100644
--- a/scss/_reboot.scss
+++ b/scss/_reboot.scss
@@ -18,8 +18,13 @@
 //    we force a non-overlapping, non-auto-hiding scrollbar to counteract.
 // 6. Change the default tap highlight to be completely transparent in iOS.
 
-html {
+*,
+*::before,
+*::after {
   box-sizing: border-box; // 1
+}
+
+html {
   font-family: sans-serif; // 2
   line-height: 1.15; // 3
   -webkit-text-size-adjust: 100%; // 4
@@ -28,12 +33,6 @@ html {
   -webkit-tap-highlight-color: rgba(0,0,0,0); // 6
 }
 
-*,
-*::before,
-*::after {
-  box-sizing: inherit; // 1
-}
-
 // IE10+ doesn't honor `<meta name="viewport">` in some cases.
 @at-root {
   @-ms-viewport { width: device-width; }