1

Is there a way to do line-wrap inside a contenteditable div without css?
Having a long text (div does not have white-space: prewrap, break-word) is there a way to break the line into multiple lines, keeping in mind that we might have "Text bold italic" ?

Razvan
  • 710
  • 3
  • 9
  • 25
  • Without CSS, but with javascript? Why without CSS? You are tagging this post as CSS as well.. – Marcos Pérez Gude Sep 23 '15 at 11:37
  • 1
    yes, i'm tagging this post as css because there might be some people that know the code behind the css pre-wrap / wrap. I need this to work with javascript because i have a div with contenteditable and i need to know where the text goes on a new line and insert a
    – Razvan Sep 23 '15 at 11:43
  • @Razvan I think that you can't know when a word goes on a new line, but you can detect what height have got contenteditable div, and with the math operation `height / line-height` you can get how many lines you have. But I think that don't solves your problem, with the inserting of the `br` tag – Marcos Pérez Gude Sep 23 '15 at 11:52
  • @MarcosPérezGude Thank you but i will still search. What i need to do is text editing in SVG. Because SVG does not have any text editing possibilities i had to find a way to do it. So i took an text editor in html and modified it to work with SVG. After 2 months of modifications i managed to do it but i still have this problem with line wraping.... thanks again :D – Razvan Sep 23 '15 at 11:57
  • Mmmmm, what about insert a textarea inside contenteditable div and count the number of characters and compare it with the number of columns of the textarea? (the property `cols`). If you make `numberOfChars / numberOfCols` you'll get the number of lines, and you can break the string splitting by `numberOfCols`. This can be helpful for you? – Marcos Pérez Gude Sep 23 '15 at 12:06
  • I will go and try this, anything helps now :D – Razvan Sep 23 '15 at 12:07
  • Ok, tell me if you can solve it this mode to put the answer. I've found anyway this related answer: http://stackoverflow.com/a/24581144/5035890 It's a js function that you pass the max-width, line-height, etc and then construct in a canvas, so the only you need to do is adapt it to a contenteditable instead of canvas element. – Marcos Pérez Gude Sep 23 '15 at 12:14

0 Answers0