Page 1 of 1

Fixed dimension blocks with overflow/clipping?

Posted: Mon Mar 09, 2009 11:34 am
by alex.barylski
I have a homepage full of information, various news feeds, classifieds, latest messages in the forum, etc.

As it stands each is variable width and height and it looks not nice. I want to place each section in a fixed sized DIV and use a floated "more" link in each so users can opt to see more if they wish.

Is there anyway to clip text that is greater in horizontal/vertical viewport -- preferably showing an ellipsis???

I am currently truncating the text based on the estimated maximum width a sequence of characters should be. Obviously this fails if the user enters all WWW's as the body text.

It would be nice if I could set the width/height of a DIV and have the horizontal tetx clipped and an ellipsis shown instead

Any ideas???

Re: Fixed dimension blocks with overflow/clipping?

Posted: Mon Mar 09, 2009 5:22 pm
by kaszu
To clip long words you can use wbr tag, and to clip off text if it exceeds container width/height use "overflow: hidden" css property.