New Glossary Page Fixes #2682 (#2695)

* My First Site, Added Glossary Site and fixed the link to device_pixel instead of device_pixels, Fixes #2682

* Applied the Feedback

* copy edit

Co-authored-by: Chris Mills <cmills@mozilla.com>

files/en-us/glossary/css_pixel/index.html

@@ -16,7 +16,7 @@
 
 <p>That definition, of course, leaves a lot of wiggle room, as the terms "be comfortably seen" and "an arm's length away" are imprecise, varying from person to person. When a user is sitting at a desk in front of a desktop, the display is generally substantially farther away from their eyes than when they're on a cell phone, for instance.</p>
 
-<p>As such, it generally suffices to say that when the unit <code>px</code> is used, the goal is to try to have the distance <code>96px</code> equal about 1 inch on the screen, regardless of the actual pixel density of the screen. In other words, if the user is on a phone with a pixel density of 266 DPI, and an element is placed on the screen with a width of <code>96px</code>, the actual width of the element would be 266 {{Glossary("device pixels")}}.</p>
+<p>As such, it generally suffices to say that when the unit <code>px</code> is used, the goal is to try to have the distance <code>96px</code> equal about 1 inch on the screen, regardless of the actual pixel density of the screen. In other words, if the user is on a phone with a pixel density of 266 DPI, and an element is placed on the screen with a width of <code>96px</code>, the actual width of the element would be 266 {{Glossary("Device pixel","device pixels")}}.</p>
 
 <h2 id="Learn_more">Learn more</h2>
 

files/en-us/glossary/device_pixel/index.html

@@ -0,0 +1,25 @@
+---
+title: Device pixel
+slug: Glossary/Device_pixel
+tags:
+  - physical pixel
+  - device pixel
+  - Glossary
+  - height
+  - length
+  - pixel
+  - size
+  - unit
+  - width
+---
+
+<p>A "pixel" is a single physical "light bulb" on a display that is capable of displaying a full color independent of its neighbours. Computer screens displaying their content in pixels. This physical pixel is also called a "device pixel".</p>
+
+<p>In contrast to the device pixel the {{Glossary("CSS pixel","CSS pixel")}} is a unit of length which roughly corresponds to the width or height of a single dot. The CSS pixel is defined as the physical size of a single pixel at a pixel density of 96 DPI, located an arm's length away from the viewer's eyes. A CSS pixel is therefore equivalent to many device pixels.</p>
+
+<h2 id="Learn_more">Learn more</h2>
+
+<ul>
+  <li><a href="https://en.wikipedia.org/wiki/Pixel">Pixels Wikipedia entry</a></li>
+  <li><a href="https://hacks.mozilla.org/2013/09/css-length-explained/">CSS Length Explained</a> on the MDN Hacks Blog</a></li>
+</ul>