Hello! I am interested in the following, for example, I have a couple of blocks with title tags that contain text, the existing text will not fit into one line, that is, it will be thrown to a new line due to not getting into the block width, I need to somehow find These are not obvious transitions to a new line in the block and for example, replace it with something, if at all possible enter image description here

  • Is the css text-overflow property unsuitable? - Moonvvell
  • It is suitable), did not know about this property .. thanks, otherwise I would have written a bicycle .. apparently it wasn’t the right question for Google to ask - russell

2 answers 2

Perhaps you about it:

.БЕЗ_ПЕРЕНОСОВ { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

    If the title is simply text without tricks, then it is necessary to ensure that it is located in one text node. For a part of the text of this node, it will be possible to determine the area it occupies. Accordingly, a change in the height of this area in most cases means a line break. A notable exception is that the height of the initial spaces is 0.

     function getRangeHeight(textNode, len) { var range = document.createRange(); range.setStart(textNode, 0); range.setEnd(textNode, len); var rect = range.getBoundingClientRect(); return rect.height || rect.bottom - rect.top; }

    I pay attention that textNode is a text node which is the only descendant of a dom element. And carefully, with an empty element, it may not exist.

    And jQuery will not help here. If only someone has already written a plugin. But since there are no explanations on what exactly needs to be done, the plug-in cannot be advised.