Add tutorial on how to add then enable Firefox’s user agent style sheet

Author: code-warrior

tutorials/css/enabling-firefox-user-agent-style-sheet/README.md

@@ -0,0 +1,9 @@
+1. In Firefox’s address bar, type `about:profiles`.
+2. Click the button at the end of the entry for `Root Directory` to open the root directory in your machine’s Finder/Explorer.
+3. Open the highlighted folder, then create a new folder called `chrome`.
+4. Create a file called `userContent.css` _inside_ the new `chrome` folder. (Consider putting the `chrome` folder under Git control.)
+5. Visit `about:config`.
+6. Search for `toolkit.legacyUserProfileCustomizations.stylesheets`, then click the `⇌` icon.
+7. Restart Firefox.
+
+**Note**: Any changes to `userContent.css` won’t take effect until you restart Firefox.

tutorials/css/index.html

@@ -70,6 +70,7 @@ <h2>Responsive Design Using Media Queries</h2>
 
     <h2>Random</h2>
     <ul>
+      <li><a href="enabling-firefox-user-agent-style-sheet">Enabling Firefox’s user agent style sheet</a></li>
       <li>The <a href="anatomy-of-a-qualified-css-rule">anatomy of a qualified rule</a></li>
       <li>Styling <a href="anchors"><code>a</code>nchors</a></li>
       <li>Single animation using a <a href="animations/single/counter"><code>counter</code></a></li>