ciser/src/_line-height.css

Functional CSS, help quickly build and design new UI without writing css.

/*

   LINE HEIGHT / LEADING
   Docs: http://tachyons.io/docs/typography/line-height

   Media Query Extensions:
     -ns = not-small
     -m  = medium       -ml = mobile landscape
     -l  = large

*/

  .lh-solid { line-height: 1; }
  .lh-title { line-height: 1.25; }
  .lh-copy  { line-height: 1.5; }

@media screen and (min-width: 30em) {
  .lh-solid-ns { line-height: 1; }
  .lh-title-ns { line-height: 1.25; }
  .lh-copy-ns  { line-height: 1.5; }
}

@media screen and (min-width: 30em) and (max-width: 60em) {
  .lh-solid-m { line-height: 1; }
  .lh-title-m { line-height: 1.25; }
  .lh-copy-m  { line-height: 1.5; }
}

@media screen and (max-width: 60em) and (orientation: landscape) {
  .lh-solid-ml { line-height: 1; }
  .lh-title-ml { line-height: 1.25; }
  .lh-copy-ml  { line-height: 1.5; }
}

@media screen and (min-width: 60em) {
  .lh-solid-l { line-height: 1; }
  .lh-title-l { line-height: 1.25; }
  .lh-copy-l  { line-height: 1.5; }
}