generator-confit/lib/buildTool/npm/documentation/templates/docs/content/foundation/05-units.md

Yeoman generator for creating the development process, tools and a sample project for current-generation web applications

## __04__ Units

### __4.1__ Relative Units
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliq.

### __4.2__ Em's v Rem's v Pixels
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

##### __Pixels__
Constant measurment based on screen pixel size.

[wrap class="{$ styles.row $}"]
  [render unit size="10px" label="1 unit"]
  [render unit size="20px" label="2 units"]
  [render unit size="30px" label="3 units"]
[/wrap]


##### __REM's__
Relative to font size of root element.

[wrap class="{$ styles.row $}"]
  [render unit size="1rem" label="1 unit"]
  [render unit size="2rem" label="2 units"]
  [render unit size="3rem" label="3 units"]
[/wrap]

##### __EM's__
Relative to font size of parent element.

[wrap class="{$ styles.row $}"]
  [render unit size="0.7142857em" label="1 unit"]
  [render unit size="1.428751em" label="2 units"]
  [render unit size="2.1428571em" label="3 units"]
[/wrap]

[wrap class="{$ styles.callout $}"]
### __4.3__ Units

__When to use what?__

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ut molestie leo, ut suscipit est. Sed ut molestie ligula. Aenean in elit at erat luctus laoreet congue sit amet massa. Donec dapibus dolor sit amet neque commodo maximus.
[/wrap]