Is vertical text-overflow possible with css3?

by

Currently there is no cross-browser CSS-only way to achieve such behavior.

You can do this now only in webkit-based browsers by using the -webkit-box and -webkit-line-clamp, see http://jsfiddle.net/ArKeu/7/

The css rule boils down to:

your-css-selector {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
}

Where the number value for -webkit-line-clamp is the maximal number of lines you want to be displayed.

More Related Contents:

  1. The page moves to the left
  2. How to disable margin-collapsing?
  3. Stretch and scale a CSS image in the background – with CSS only
  4. Does “display:none” prevent an image from loading?
  5. How can I write a ‘:hover’ condition for ‘a:before’ and ‘a:after’?
  6. Semi-transparent color layer over background-image?
  7. Is there a way to break a list into columns?
  8. Transparent hollow or cut out circle
  9. vertical align middle in
  10. How to make 3-corner-rounded triangle in CSS
  11. What is the difference between :first-child and :first-of-type?
  12. How can I scale an image in a CSS sprite
  13. What does an asterisk do in a CSS property name? [duplicate]
  14. Gradient text color
  15. difference between css height : 100% vs height : auto
  16. Specify multiple attribute selectors in CSS
  17. Bootstrap xs columns wrap
  18. Image Greyscale with CSS & re-color on mouse-over?
  19. Right to left Text HTML input
  20. complete styles for cross browser CSS zoom
  21. What Does ‘zoom’ do in CSS?
  22. How to make radial gradients work in Safari?
  23. Anyway to prevent the Blue highlighting of elements in Chrome when clicking quickly?
  24. SVG Fill not being applied in FireFox
  25. CSS overlapping arrow
  26. How can I use/emulate regex-like backreferences in attribute selectors?
  27. Vue.js toggle class on click
  28. Is there a way to style HTML5’s range control?
  29. Keep background image fixed during scroll using css
  30. How to keep :active css style after clicking an element

Leave a Comment