Responsive CSS module for setting max-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-max-height-percentages 0.0.6

Css module of single purpose classes for max height percentages

Stats

1634 400 400
bytes selectors declarations

Installation

With npm

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

With Git

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

Usage

Using with PostCSS

Import the css module

@import "css-max-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-max-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

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