Skip to content

Instantly share code, notes, and snippets.

@isao

isao/line-clamp.scss

Last active March 4, 2021 21:56
Show Gist options
  • Save isao/fdbd8fa094e6389b1c0b09b2df753d9d to your computer and use it in GitHub Desktop.
Save isao/fdbd8fa094e6389b1c0b09b2df753d9d to your computer and use it in GitHub Desktop.
Download ZIP
dma/app/styles/core/mixins/line-clamp.scss
Raw
line-clamp.scss
///
/// Line-Clamp
///
/// https://medium.com/@elad/trimming-multi-lines-in-css-5ae59d5e6d84
///
@mixin line-clamp($lines: null) {
@if $lines != null {
display: -webkit-box; /* stylelint-disable-line value-no-vendor-prefix */
-webkit-line-clamp: $lines;
-webkit-box-orient: vertical; /* stylelint-disable-line property-no-vendor-prefix */
overflow: hidden;
}
@else {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
}
@johnnybenson
Copy link

johnnybenson commented Mar 4, 2021 •
edited
Loading

Thank you for posting this

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment