Here is pen: [ https://codepen.io/ustvarno/pen/VjPQdY ]
If i set
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
i get wierd one dot or two at the end (never three dots), when overflow happens for horizontal axis
But i want if it happend for vertical axis, then i want to find out at what index of string it happend so i can add button more, or three dots
My div is block type and have height represent in pixels
I don’t see any div
block, dots, or text, other than ‘Recipe Patterns’. I do see an error in the console saying you need to use strict mode for let/const
.
I’m very sorry bout that, take look now please, and try to duplicate content in recipe body to overflow parent
I don’t see any change. Error is still there, don’t see any divs.
Checked again in google chrome and firefox, works
Ah. Doesn’t work in Safari. I was able to see it in Chrome. Try using overflow-y
and set a max-height
.
I will take a look for safari.
how that gonna help me for finding index? Or to show button more
You can’t find that index. If you want a ‘show more’ button, you can trigger that by comparing the div
's scroll height to its client height.
StackOverflow link
1 Like