0

I am trying to add ellipsis in column .I am using ionic framework with angular js .I am displaying data in column .But when data is more than 2 or two line it should show "..." or ellipsis .I google it found this solution

CSS word ellipsis ('...') after one or two lines

but it will not work the I found another solution this http://codepen.io/martinwolf/pen/qlFdp .it also not work for me

here is my code

http://plnkr.co/edit/BILpSThKHWZpKBqYIoQz?p=preview

.columnClass {

  margin: 0 auto;

  line-height: $line-height;
  -webkit-line-clamp: 2
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

any update regarding this

Community
  • 1
  • 1
user944513
  • 12,247
  • 49
  • 168
  • 318
  • I think it only works if you put `white-space:nowrap;`, but you can't achieve multiline purpose with this. I will research right now for a solution. http://codepen.io/anon/pen/zGWeNq – Marcos Pérez Gude Jul 08 '15 at 06:33

1 Answers1

0

You can try this solution:

https://github.com/josephschmitt/Clamp.js

It adds compatibility for non-webkit browsers. I wish you solve the problem. The use:

$clamp(myHeader, {clamp: 3}); // 3 lines
$clamp(myParagraph, {clamp: "25px"}); // 25 pixels

Good luck :)

Marcos Pérez Gude
  • 21,869
  • 4
  • 38
  • 69