Responsive CSS module for setting min-height with percentages
CSS
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
css
src
.gitignore
LICENSE.txt
README.md
package.json

README.md

css-min-height-percentages 0.0.6

Css module of single purpose classes for min height percentages

Stats

1608 400 400
bytes selectors declarations

Installation

With npm

npm install --save-dev css-min-height-percentages

With Git

git clone https://github.com/tachyons-css/css-min-height-percentages

Usage

Using with PostCSS

Import the css module

@import "css-min-height-percentages";

Then process the CSS using the tachyons-cli

$ npm i -g tachyons-cli
$ tachyons-cli path/to/css-file.css > dist/t.css

Using the CSS

The built CSS is located in the css directory. It contains an unminified and minified version. You can either cut and paste that css or link to it directly in your html.

<link rel="stylesheet" href="path/to/module/css/css-min-height-percentages">

Development

The source CSS files can be found in the src directory. Running $ npm start will process the source CSS and place the built CSS in the css directory.

The CSS

/*
   MIN HEIGHTS - PERCENTAGES
*/
.mn-hi-1 { min-height: 1%; }
.mn-hi-2 { min-height: 2%; }
.mn-hi-3 { min-height: 3%; }
.mn-hi-4 { min-height: 4%; }
.mn-hi-5 { min-height: 5%; }
.mn-hi-6 { min-height: 6%; }
.mn-hi-7 { min-height: 7%; }
.mn-hi-8 { min-height: 8%; }
.mn-hi-9 { min-height: 9%; }
.mn-hi-10 { min-height: 10%; }
.mn-hi-11 { min-height: 11%; }
.mn-hi-12 { min-height: 12%; }
.mn-hi-13 { min-height: 13%; }
.mn-hi-14 { min-height: 14%; }
.mn-hi-15 { min-height: 15%; }
.mn-hi-16 { min-height: 16%; }
.mn-hi-17 { min-height: 17%; }
.mn-hi-18 { min-height: 18%; }
.mn-hi-19 { min-height: 19%; }
.mn-hi-20 { min-height: 20%; }
.mn-hi-21 { min-height: 21%; }
.mn-hi-22 { min-height: 22%; }
.mn-hi-23 { min-height: 23%; }
.mn-hi-24 { min-height: 24%; }
.mn-hi-25 { min-height: 25%; }
.mn-hi-26 { min-height: 26%; }
.mn-hi-27 { min-height: 27%; }
.mn-hi-28 { min-height: 28%; }
.mn-hi-29 { min-height: 29%; }
.mn-hi-30 { min-height: 30%; }
.mn-hi-31 { min-height: 31%; }
.mn-hi-32 { min-height: 32%; }
.mn-hi-33 { min-height: 33%; }
.mn-hi-34 { min-height: 34%; }
.mn-hi-35 { min-height: 35%; }
.mn-hi-36 { min-height: 36%; }
.mn-hi-37 { min-height: 37%; }
.mn-hi-38 { min-height: 38%; }
.mn-hi-39 { min-height: 39%; }
.mn-hi-40 { min-height: 40%; }
.mn-hi-41 { min-height: 41%; }
.mn-hi-42 { min-height: 42%; }
.mn-hi-43 { min-height: 43%; }
.mn-hi-44 { min-height: 44%; }
.mn-hi-45 { min-height: 45%; }
.mn-hi-46 { min-height: 46%; }
.mn-hi-47 { min-height: 47%; }
.mn-hi-48 { min-height: 48%; }
.mn-hi-49 { min-height: 49%; }
.mn-hi-50 { min-height: 50%; }
.mn-hi-51 { min-height: 51%; }
.mn-hi-52 { min-height: 52%; }
.mn-hi-53 { min-height: 53%; }
.mn-hi-54 { min-height: 54%; }
.mn-hi-55 { min-height: 55%; }
.mn-hi-56 { min-height: 56%; }
.mn-hi-57 { min-height: 57%; }
.mn-hi-58 { min-height: 58%; }
.mn-hi-59 { min-height: 59%; }
.mn-hi-60 { min-height: 60%; }
.mn-hi-61 { min-height: 61%; }
.mn-hi-62 { min-height: 62%; }
.mn-hi-63 { min-height: 63%; }
.mn-hi-64 { min-height: 64%; }
.mn-hi-65 { min-height: 65%; }
.mn-hi-66 { min-height: 66%; }
.mn-hi-67 { min-height: 67%; }
.mn-hi-68 { min-height: 68%; }
.mn-hi-69 { min-height: 69%; }
.mn-hi-70 { min-height: 70%; }
.mn-hi-71 { min-height: 71%; }
.mn-hi-72 { min-height: 72%; }
.mn-hi-73 { min-height: 73%; }
.mn-hi-74 { min-height: 74%; }
.mn-hi-75 { min-height: 75%; }
.mn-hi-76 { min-height: 76%; }
.mn-hi-77 { min-height: 77%; }
.mn-hi-78 { min-height: 78%; }
.mn-hi-79 { min-height: 79%; }
.mn-hi-80 { min-height: 80%; }
.mn-hi-81 { min-height: 81%; }
.mn-hi-82 { min-height: 82%; }
.mn-hi-83 { min-height: 83%; }
.mn-hi-84 { min-height: 84%; }
.mn-hi-85 { min-height: 85%; }
.mn-hi-86 { min-height: 86%; }
.mn-hi-87 { min-height: 87%; }
.mn-hi-88 { min-height: 88%; }
.mn-hi-89 { min-height: 89%; }
.mn-hi-90 { min-height: 90%; }
.mn-hi-91 { min-height: 91%; }
.mn-hi-92 { min-height: 92%; }
.mn-hi-93 { min-height: 93%; }
.mn-hi-94 { min-height: 94%; }
.mn-hi-95 { min-height: 95%; }
.mn-hi-96 { min-height: 96%; }
.mn-hi-97 { min-height: 97%; }
.mn-hi-98 { min-height: 98%; }
.mn-hi-99 { min-height: 99%; }
.mn-hi-100 { min-height: 100%; }
@media screen and (min-width: 48em) {
 .mn-hi-1-ns { min-height: 1%; }
 .mn-hi-2-ns { min-height: 2%; }
 .mn-hi-3-ns { min-height: 3%; }
 .mn-hi-4-ns { min-height: 4%; }
 .mn-hi-5-ns { min-height: 5%; }
 .mn-hi-6-ns { min-height: 6%; }
 .mn-hi-7-ns { min-height: 7%; }
 .mn-hi-8-ns { min-height: 8%; }
 .mn-hi-9-ns { min-height: 9%; }
 .mn-hi-10-ns { min-height: 10%; }
 .mn-hi-11-ns { min-height: 11%; }
 .mn-hi-12-ns { min-height: 12%; }
 .mn-hi-13-ns { min-height: 13%; }
 .mn-hi-14-ns { min-height: 14%; }
 .mn-hi-15-ns { min-height: 15%; }
 .mn-hi-16-ns { min-height: 16%; }
 .mn-hi-17-ns { min-height: 17%; }
 .mn-hi-18-ns { min-height: 18%; }
 .mn-hi-19-ns { min-height: 19%; }
 .mn-hi-20-ns { min-height: 20%; }
 .mn-hi-21-ns { min-height: 21%; }
 .mn-hi-22-ns { min-height: 22%; }
 .mn-hi-23-ns { min-height: 23%; }
 .mn-hi-24-ns { min-height: 24%; }
 .mn-hi-25-ns { min-height: 25%; }
 .mn-hi-26-ns { min-height: 26%; }
 .mn-hi-27-ns { min-height: 27%; }
 .mn-hi-28-ns { min-height: 28%; }
 .mn-hi-29-ns { min-height: 29%; }
 .mn-hi-30-ns { min-height: 30%; }
 .mn-hi-31-ns { min-height: 31%; }
 .mn-hi-32-ns { min-height: 32%; }
 .mn-hi-33-ns { min-height: 33%; }
 .mn-hi-34-ns { min-height: 34%; }
 .mn-hi-35-ns { min-height: 35%; }
 .mn-hi-36-ns { min-height: 36%; }
 .mn-hi-37-ns { min-height: 37%; }
 .mn-hi-38-ns { min-height: 38%; }
 .mn-hi-39-ns { min-height: 39%; }
 .mn-hi-40-ns { min-height: 40%; }
 .mn-hi-41-ns { min-height: 41%; }
 .mn-hi-42-ns { min-height: 42%; }
 .mn-hi-43-ns { min-height: 43%; }
 .mn-hi-44-ns { min-height: 44%; }
 .mn-hi-45-ns { min-height: 45%; }
 .mn-hi-46-ns { min-height: 46%; }
 .mn-hi-47-ns { min-height: 47%; }
 .mn-hi-48-ns { min-height: 48%; }
 .mn-hi-49-ns { min-height: 49%; }
 .mn-hi-50-ns { min-height: 50%; }
 .mn-hi-51-ns { min-height: 51%; }
 .mn-hi-52-ns { min-height: 52%; }
 .mn-hi-53-ns { min-height: 53%; }
 .mn-hi-54-ns { min-height: 54%; }
 .mn-hi-55-ns { min-height: 55%; }
 .mn-hi-56-ns { min-height: 56%; }
 .mn-hi-57-ns { min-height: 57%; }
 .mn-hi-58-ns { min-height: 58%; }
 .mn-hi-59-ns { min-height: 59%; }
 .mn-hi-60-ns { min-height: 60%; }
 .mn-hi-61-ns { min-height: 61%; }
 .mn-hi-62-ns { min-height: 62%; }
 .mn-hi-63-ns { min-height: 63%; }
 .mn-hi-64-ns { min-height: 64%; }
 .mn-hi-65-ns { min-height: 65%; }
 .mn-hi-66-ns { min-height: 66%; }
 .mn-hi-67-ns { min-height: 67%; }
 .mn-hi-68-ns { min-height: 68%; }
 .mn-hi-69-ns { min-height: 69%; }
 .mn-hi-70-ns { min-height: 70%; }
 .mn-hi-71-ns { min-height: 71%; }
 .mn-hi-72-ns { min-height: 72%; }
 .mn-hi-73-ns { min-height: 73%; }
 .mn-hi-74-ns { min-height: 74%; }
 .mn-hi-75-ns { min-height: 75%; }
 .mn-hi-76-ns { min-height: 76%; }
 .mn-hi-77-ns { min-height: 77%; }
 .mn-hi-78-ns { min-height: 78%; }
 .mn-hi-79-ns { min-height: 79%; }
 .mn-hi-80-ns { min-height: 80%; }
 .mn-hi-81-ns { min-height: 81%; }
 .mn-hi-82-ns { min-height: 82%; }
 .mn-hi-83-ns { min-height: 83%; }
 .mn-hi-84-ns { min-height: 84%; }
 .mn-hi-85-ns { min-height: 85%; }
 .mn-hi-86-ns { min-height: 86%; }
 .mn-hi-87-ns { min-height: 87%; }
 .mn-hi-88-ns { min-height: 88%; }
 .mn-hi-89-ns { min-height: 89%; }
 .mn-hi-90-ns { min-height: 90%; }
 .mn-hi-91-ns { min-height: 91%; }
 .mn-hi-92-ns { min-height: 92%; }
 .mn-hi-93-ns { min-height: 93%; }
 .mn-hi-94-ns { min-height: 94%; }
 .mn-hi-95-ns { min-height: 95%; }
 .mn-hi-96-ns { min-height: 96%; }
 .mn-hi-97-ns { min-height: 97%; }
 .mn-hi-98-ns { min-height: 98%; }
 .mn-hi-99-ns { min-height: 99%; }
 .mn-hi-100-ns { min-height: 100%; }
}
@media screen and (min-width:48em) and (max-width: 64em) {
 .mn-hi-1-m { min-height: 1%; }
 .mn-hi-2-m { min-height: 2%; }
 .mn-hi-3-m { min-height: 3%; }
 .mn-hi-4-m { min-height: 4%; }
 .mn-hi-5-m { min-height: 5%; }
 .mn-hi-6-m { min-height: 6%; }
 .mn-hi-7-m { min-height: 7%; }
 .mn-hi-8-m { min-height: 8%; }
 .mn-hi-9-m { min-height: 9%; }
 .mn-hi-10-m { min-height: 10%; }
 .mn-hi-11-m { min-height: 11%; }
 .mn-hi-12-m { min-height: 12%; }
 .mn-hi-13-m { min-height: 13%; }
 .mn-hi-14-m { min-height: 14%; }
 .mn-hi-15-m { min-height: 15%; }
 .mn-hi-16-m { min-height: 16%; }
 .mn-hi-17-m { min-height: 17%; }
 .mn-hi-18-m { min-height: 18%; }
 .mn-hi-19-m { min-height: 19%; }
 .mn-hi-20-m { min-height: 20%; }
 .mn-hi-21-m { min-height: 21%; }
 .mn-hi-22-m { min-height: 22%; }
 .mn-hi-23-m { min-height: 23%; }
 .mn-hi-24-m { min-height: 24%; }
 .mn-hi-25-m { min-height: 25%; }
 .mn-hi-26-m { min-height: 26%; }
 .mn-hi-27-m { min-height: 27%; }
 .mn-hi-28-m { min-height: 28%; }
 .mn-hi-29-m { min-height: 29%; }
 .mn-hi-30-m { min-height: 30%; }
 .mn-hi-31-m { min-height: 31%; }
 .mn-hi-32-m { min-height: 32%; }
 .mn-hi-33-m { min-height: 33%; }
 .mn-hi-34-m { min-height: 34%; }
 .mn-hi-35-m { min-height: 35%; }
 .mn-hi-36-m { min-height: 36%; }
 .mn-hi-37-m { min-height: 37%; }
 .mn-hi-38-m { min-height: 38%; }
 .mn-hi-39-m { min-height: 39%; }
 .mn-hi-40-m { min-height: 40%; }
 .mn-hi-41-m { min-height: 41%; }
 .mn-hi-42-m { min-height: 42%; }
 .mn-hi-43-m { min-height: 43%; }
 .mn-hi-44-m { min-height: 44%; }
 .mn-hi-45-m { min-height: 45%; }
 .mn-hi-46-m { min-height: 46%; }
 .mn-hi-47-m { min-height: 47%; }
 .mn-hi-48-m { min-height: 48%; }
 .mn-hi-49-m { min-height: 49%; }
 .mn-hi-50-m { min-height: 50%; }
 .mn-hi-51-m { min-height: 51%; }
 .mn-hi-52-m { min-height: 52%; }
 .mn-hi-53-m { min-height: 53%; }
 .mn-hi-54-m { min-height: 54%; }
 .mn-hi-55-m { min-height: 55%; }
 .mn-hi-56-m { min-height: 56%; }
 .mn-hi-57-m { min-height: 57%; }
 .mn-hi-58-m { min-height: 58%; }
 .mn-hi-59-m { min-height: 59%; }
 .mn-hi-60-m { min-height: 60%; }
 .mn-hi-61-m { min-height: 61%; }
 .mn-hi-62-m { min-height: 62%; }
 .mn-hi-63-m { min-height: 63%; }
 .mn-hi-64-m { min-height: 64%; }
 .mn-hi-65-m { min-height: 65%; }
 .mn-hi-66-m { min-height: 66%; }
 .mn-hi-67-m { min-height: 67%; }
 .mn-hi-68-m { min-height: 68%; }
 .mn-hi-69-m { min-height: 69%; }
 .mn-hi-70-m { min-height: 70%; }
 .mn-hi-71-m { min-height: 71%; }
 .mn-hi-72-m { min-height: 72%; }
 .mn-hi-73-m { min-height: 73%; }
 .mn-hi-74-m { min-height: 74%; }
 .mn-hi-75-m { min-height: 75%; }
 .mn-hi-76-m { min-height: 76%; }
 .mn-hi-77-m { min-height: 77%; }
 .mn-hi-78-m { min-height: 78%; }
 .mn-hi-79-m { min-height: 79%; }
 .mn-hi-80-m { min-height: 80%; }
 .mn-hi-81-m { min-height: 81%; }
 .mn-hi-82-m { min-height: 82%; }
 .mn-hi-83-m { min-height: 83%; }
 .mn-hi-84-m { min-height: 84%; }
 .mn-hi-85-m { min-height: 85%; }
 .mn-hi-86-m { min-height: 86%; }
 .mn-hi-87-m { min-height: 87%; }
 .mn-hi-88-m { min-height: 88%; }
 .mn-hi-89-m { min-height: 89%; }
 .mn-hi-90-m { min-height: 90%; }
 .mn-hi-91-m { min-height: 91%; }
 .mn-hi-92-m { min-height: 92%; }
 .mn-hi-93-m { min-height: 93%; }
 .mn-hi-94-m { min-height: 94%; }
 .mn-hi-95-m { min-height: 95%; }
 .mn-hi-96-m { min-height: 96%; }
 .mn-hi-97-m { min-height: 97%; }
 .mn-hi-98-m { min-height: 98%; }
 .mn-hi-99-m { min-height: 99%; }
 .mn-hi-100-m { min-height: 100%; }
}
@media screen and (min-width: 64em) {
 .mn-hi-1-l { min-height: 1%; }
 .mn-hi-2-l { min-height: 2%; }
 .mn-hi-3-l { min-height: 3%; }
 .mn-hi-4-l { min-height: 4%; }
 .mn-hi-5-l { min-height: 5%; }
 .mn-hi-6-l { min-height: 6%; }
 .mn-hi-7-l { min-height: 7%; }
 .mn-hi-8-l { min-height: 8%; }
 .mn-hi-9-l { min-height: 9%; }
 .mn-hi-10-l { min-height: 10%; }
 .mn-hi-11-l { min-height: 11%; }
 .mn-hi-12-l { min-height: 12%; }
 .mn-hi-13-l { min-height: 13%; }
 .mn-hi-14-l { min-height: 14%; }
 .mn-hi-15-l { min-height: 15%; }
 .mn-hi-16-l { min-height: 16%; }
 .mn-hi-17-l { min-height: 17%; }
 .mn-hi-18-l { min-height: 18%; }
 .mn-hi-19-l { min-height: 19%; }
 .mn-hi-20-l { min-height: 20%; }
 .mn-hi-21-l { min-height: 21%; }
 .mn-hi-22-l { min-height: 22%; }
 .mn-hi-23-l { min-height: 23%; }
 .mn-hi-24-l { min-height: 24%; }
 .mn-hi-25-l { min-height: 25%; }
 .mn-hi-26-l { min-height: 26%; }
 .mn-hi-27-l { min-height: 27%; }
 .mn-hi-28-l { min-height: 28%; }
 .mn-hi-29-l { min-height: 29%; }
 .mn-hi-30-l { min-height: 30%; }
 .mn-hi-31-l { min-height: 31%; }
 .mn-hi-32-l { min-height: 32%; }
 .mn-hi-33-l { min-height: 33%; }
 .mn-hi-34-l { min-height: 34%; }
 .mn-hi-35-l { min-height: 35%; }
 .mn-hi-36-l { min-height: 36%; }
 .mn-hi-37-l { min-height: 37%; }
 .mn-hi-38-l { min-height: 38%; }
 .mn-hi-39-l { min-height: 39%; }
 .mn-hi-40-l { min-height: 40%; }
 .mn-hi-41-l { min-height: 41%; }
 .mn-hi-42-l { min-height: 42%; }
 .mn-hi-43-l { min-height: 43%; }
 .mn-hi-44-l { min-height: 44%; }
 .mn-hi-45-l { min-height: 45%; }
 .mn-hi-46-l { min-height: 46%; }
 .mn-hi-47-l { min-height: 47%; }
 .mn-hi-48-l { min-height: 48%; }
 .mn-hi-49-l { min-height: 49%; }
 .mn-hi-50-l { min-height: 50%; }
 .mn-hi-51-l { min-height: 51%; }
 .mn-hi-52-l { min-height: 52%; }
 .mn-hi-53-l { min-height: 53%; }
 .mn-hi-54-l { min-height: 54%; }
 .mn-hi-55-l { min-height: 55%; }
 .mn-hi-56-l { min-height: 56%; }
 .mn-hi-57-l { min-height: 57%; }
 .mn-hi-58-l { min-height: 58%; }
 .mn-hi-59-l { min-height: 59%; }
 .mn-hi-60-l { min-height: 60%; }
 .mn-hi-61-l { min-height: 61%; }
 .mn-hi-62-l { min-height: 62%; }
 .mn-hi-63-l { min-height: 63%; }
 .mn-hi-64-l { min-height: 64%; }
 .mn-hi-65-l { min-height: 65%; }
 .mn-hi-66-l { min-height: 66%; }
 .mn-hi-67-l { min-height: 67%; }
 .mn-hi-68-l { min-height: 68%; }
 .mn-hi-69-l { min-height: 69%; }
 .mn-hi-70-l { min-height: 70%; }
 .mn-hi-71-l { min-height: 71%; }
 .mn-hi-72-l { min-height: 72%; }
 .mn-hi-73-l { min-height: 73%; }
 .mn-hi-74-l { min-height: 74%; }
 .mn-hi-75-l { min-height: 75%; }
 .mn-hi-76-l { min-height: 76%; }
 .mn-hi-77-l { min-height: 77%; }
 .mn-hi-78-l { min-height: 78%; }
 .mn-hi-79-l { min-height: 79%; }
 .mn-hi-80-l { min-height: 80%; }
 .mn-hi-81-l { min-height: 81%; }
 .mn-hi-82-l { min-height: 82%; }
 .mn-hi-83-l { min-height: 83%; }
 .mn-hi-84-l { min-height: 84%; }
 .mn-hi-85-l { min-height: 85%; }
 .mn-hi-86-l { min-height: 86%; }
 .mn-hi-87-l { min-height: 87%; }
 .mn-hi-88-l { min-height: 88%; }
 .mn-hi-89-l { min-height: 89%; }
 .mn-hi-90-l { min-height: 90%; }
 .mn-hi-91-l { min-height: 91%; }
 .mn-hi-92-l { min-height: 92%; }
 .mn-hi-93-l { min-height: 93%; }
 .mn-hi-94-l { min-height: 94%; }
 .mn-hi-95-l { min-height: 95%; }
 .mn-hi-96-l { min-height: 96%; }
 .mn-hi-97-l { min-height: 97%; }
 .mn-hi-98-l { min-height: 98%; }
 .mn-hi-99-l { min-height: 99%; }
 .mn-hi-100-l { min-height: 100%; }
}

Contributing

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request

Authors

License

ISC