Read More/Less

by bhupendra negi

HTML

<div data-role="header">
    <h1>readmore example</h1>
  </div>
  <div data-role="content">

    <div class="less">
With AngularJS, the "Ready, Fire, Aim" learning methodology of duct taping together a handful of tutorials and a cursory glance through the documentation will lead to confusion and frustration. This curriculum is designed to properly guide you through each of the key Angular concepts thoroughly with a broad exposure to high quality content. With your eventual mastery of AngularJS, you will be able to fluently and efficiently construct large-scale applications.
    </div>
    <a href="https://www.google.co.in/?gfe_rd=cr&ei=PMgEV6nsF6qH8QeWv7W4BA" class="text-size">Read more...</a>

CSS

.less {
  word-wrap: break-word;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}


.text-size {
  display: block;
  text-align: right;
  padding-top: 10px;
  color: blue !important;
  cursor: pointer;
}