Clamp.js
Clamp.js copied to clipboard
Fixed problem with non-integer line height
This library couldn't handle non-integer line heights.
E.g. if you want to clamp a text at two lines and the line height is 22.5px the code would parseInt
that to 22. Multiplied by two that's a max height of 44px. However, the browser displays two lines with height 45px. 45 > 44, so another line would be clamped so that only one line is left.
Solution: Replaced some parseInt
calls with parseFloat
.
Another problem: Say you have a line height of 20.89px and you want to clamp at two lines again. Now multiplied by two that makes a max height of 41.78px. However, the browser reports the two lines of text as height 42px. Since 42 > 41.78 another line would be clamped again so that only one line is left.
Solution: Math.ceil
the max height.