0

Possible Duplicate:
Insert ellipsis (…) into HTML tag if content too wide
With CSS, use “…” for overflowed block of multi-lines

Hi I am trying to have a div tag to display a question this div box is constrained by size, because of the lay out specification this div tag should show as much text as it can, if it can't show all, it should have ellipsis (i.e. .....) at the end

currently i want it to display maximum 3 lines in that div

if it is more than 3 lines, than it will show ellipsis

example:

This is a question, from follow student who attended...

my current style for that div tag is the following:

 .question {
    max-height: 40px;
    max-width:200px
    text-overflow: ellipsis;
    overflow: auto;
 }

this doesn't do the trick... please help

Community
  • 1
  • 1
user1118019
  • 3,819
  • 8
  • 40
  • 46
  • 1
    Multiline isn't supported. You will need javascript to support this. See these two SO questions. http://stackoverflow.com/questions/6222616/with-css-use-for-overflowed-block-of-multi-lines and http://stackoverflow.com/questions/536814/insert-ellipsis-into-html-tag-if-content-too-wide – mrtsherman Mar 21 '12 at 03:39
  • Put a jsfiddle or any working example, this will be easy to encounter real problem – Jack Mar 21 '12 at 06:07
  • added example plesae help http://jsfiddle.net/prWkN/1/ – user1118019 Mar 21 '12 at 16:25

1 Answers1

1

Add "overflow: hidden" to the above

theonova
  • 21
  • 2
  • that didn't fix it sir. it only shows the letters that can fit in the box, rest are 'hidden', no ellipis shown – user1118019 Mar 21 '12 at 03:49
  • This cannot be done with pure CSS. You'll need JavaScript to do multi-line ellipsis on the client side. There's lots of jQuery plugins available that do this today. – Eric Rowell Mar 20 '13 at 23:07