diff --git a/package.json b/package.json
index 33f8788a..2221003b 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,8 @@
   "description": "Easily add \"zoom on hover\" functionality to your site's images. Lightweight, no-dependency JavaScript.",
   "contributors": [
     "Frederick Fogerty <frederick.fogerty@gmail.com> (https://github.com/frederickfogerty)",
-    "Sherwin Heydarbeygi <sherwin@imgix.com> (https://github.com/sherwinski)"
+    "Sherwin Heydarbeygi <sherwin@imgix.com> (https://github.com/sherwinski)",
+    "Luis Ball <lball@imgix.com> (https://github.com/luqven)"
   ],
   "main": "lib/Drift.js",
   "module": "es/Drift.js",
diff --git a/src/js/injectBaseStylesheet.js b/src/js/injectBaseStylesheet.js
index 63fee620..7d8cdd11 100644
--- a/src/js/injectBaseStylesheet.js
+++ b/src/js/injectBaseStylesheet.js
@@ -55,13 +55,14 @@ export default function injectBaseStylesheet() {
     return;
   }
 
+  // create the injected styles
   const styleEl = document.createElement("style");
-  styleEl.type = "text/css";
   styleEl.classList = "drift-base-styles";
-
   styleEl.textContent = RULES;
-  const head = document.head;
 
+  // prepend them to the document head's first child
+  const head = document.head;
   const allHeadElements = head.getElementsByTagName("*");
-  allHeadElements.innerHTML = styleEl + allHeadElements.innerHTML;
+  const firstItem = allHeadElements.item(0);
+  firstItem.outerHTML = styleEl.outerHTML + firstItem.outerHTML;
 }