Skip to content

Instantly share code, notes, and snippets.

@tdeedlesATX
Created July 7, 2017 20:32
Show Gist options
  • Save tdeedlesATX/bf7c96870479155fa0e30703f5e7a173 to your computer and use it in GitHub Desktop.
Save tdeedlesATX/bf7c96870479155fa0e30703f5e7a173 to your computer and use it in GitHub Desktop.
Multi-line ellipsis .less function
/* @offset: should equal top + bottom padding for border-box situations */
/* @line-height: should be unitless */
.multiline-text-overflow-ellipsis(@font-size, @line-height, @max-lines, @max-width, @offset) {
display: block; /* Fallback for non-webkit */
display: -webkit-box;
max-width: @max-width;
height: @font-size*@line-height*@max-lines + @offset; /* Fallback for non-webkit */
font-size: @font-size;
line-height: @line-height;
-webkit-line-clamp: @max-lines;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment