Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Trouble with elegant text-overflow on fluid containers

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #200120
    damon
    Participant

    http://codepen.io/thedamon/pen/XJLReZ

    So I have these fluid squares but I want to figure out how to get the text to overflow elegantly, since the amount of text that will fit varies so greatly and looks foolish if it gets cut off at the shortest feasible amount. and even if we’re clamping the height, we don’t have an overflow indication, and most don’t work easily because the colours are alternating.

    I have tried many of the CSS solutions, but ones that require a set number of lines require a crazy amount of customization.. and can’t really work because the amount is not entirely based on breakpoints

    Wondering what suggestions you have to get the text overflowing elegantly, ideally with an ellipsis at the end.

    also having a crazy time getting any javascript libraries to work with it because the containing element doesn’t have height (if it’s the div) + the whole responsiveness issue.

    I got jQuery.dotdotdot sort of working, but it is not quite reliable with when it cuts off the text when the window is resized..

Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.