<div class="main">
  <img src="https://mir-s3-cdn-cf.behance.net/projects/404/65f7aa52878161.Y3JvcCwyMDUwLDE2MDUsMjUzLDA.png" />
  <div class="line-clam">
    Chasing this arbitrary measure only gets in the way. Dedicate yourself to something greater and more concrete and let success come as a byproduct.
  </div>
</div>


.main{
  width:320px;
  margin: 20px auto; 
}

img{
  max-width:100%;
}
.line-clam {
  text-align:left;
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.