imharshm/index.html

## index.html
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<style>
.container {
  width: 300px;
  border: 1px solid #e7e7e7;
  border-radius: 4px;
  padding: 1rem;
}

.text-truncate-vertical {
  text-align: left;
  display: -webkit-box;
  -webkit-line-clamp: 4; /*define how many line you want to show */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
 }

</style>
<body>

<div class="container">
  <p class="text-truncate-vertical">Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out    print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.</p>
</div>

</body>
</html>
	<!DOCTYPE html>
	<html>
	<title>W3.CSS</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
	<style>
	.container {
	width: 300px;
	border: 1px solid #e7e7e7;
	border-radius: 4px;
	padding: 1rem;
	}

	.text-truncate-vertical {
	text-align: left;
	display: -webkit-box;
	-webkit-line-clamp: 4; /define how many line you want to show /
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	}

	</style>
	<body>

	<div class="container">
	<p class="text-truncate-vertical">Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.</p>
	</div>

	</body>
	</html>