I am a big fan of the evolution of CSS, especially how it is becoming a powerful language for visual logic on the web. I would like to suggest a feature that would allow CSS to detect when text is truncated (for example, when text-overflow: ellipsis causes visible ellipsis at the end of a line).

Currently, this is only possible with JavaScript, by comparing element sizes. My idea is that CSS could natively expose this state-perhaps through an extension of container scroll-state queries-so that styles or content could react to truncation without the need for JavaScript.

For example, if a container or element’s text is visually truncated, it would be helpful to have a CSS query or pseudo-class that detects this state, enabling us to display additional UI or hints for users.

You can see a demonstration of the use case here: Codepen sample

Is such a feature (for example, a truncated state in scroll-state or container queries) being considered for future CSS specifications? I believe this would be a valuable addition for both usability and accessibility, and would further reduce the need for JavaScript in visual logic.