Skip to main content
Question

Truncate single line text bug


tasos.dervenagas

Hi there,

In some cases text truncation doesn’t behave as expected. More specifically, when I’m truncating a single line string which is set to middle align, the the overflown text is wrapped in multiple lines (expected) but the perceived text box is positioned in the middle, so the text appears cropped and misplaced:

Whereas, when I change the vertical alignment to top, the cropped text is positioned at the top of its box but the string isn’t vertically aligned in the middle any more:

To me seems like a bug. Is there anything I’m missing or any workaround? Thanks!

2 replies

Same here. My workaround is to set the height of the text element to a fixed height which has to be the same as font-size and line-height.


Now you could set Vertical Alignment of the text property to top. If the outer Container is vertical aligned to the middle via auto layout it works.


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings