JSFiddle - React, Tailwind, and code Playground

by Ed Bulikyan

HTML

<a href="" class="title">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et.</a>

SCSS

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  padding: 3em 2em;
  font-family: 'Open Sans', Arial, sans-serif;
  color: #cf6824;
}

$font-size: 12px;
$line-height: 1.33;
$lines-to-show: 2;

.title {
	display: block;
	display: -webkit-box;
	max-width: 140px;
	text-align: center;
	height: $font-size * $line-height * $lines-to-show;
	text-decoration: none;
	font-size: $font-size;
	line-height: $line-height;
	-webkit-line-clamp: $lines-to-show;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}