1

I have a strange behaviour on the text editor on my D7 site. I am using WYSIWYG-7.x-2.1 module with CKEditor v.3.6.3.7474.

If I type:

test

test

test

on the editor then Disable rich-text I can see:

<p>test</p><p>test</p><p>test</p>

Which is correct. Now if I Enable rich-text and then put my cursor at end of line 1 then press delete, it makes the 2nd line join the end of the first line:

testtest

test

Then I press Return again to separate those lines:

test

test

test

Now if I Disable rich-text I get:

<p>test</p><p><span style="line-height: 1.538em;">test</span></p><p>test</p>

As you can see it has created a span tag with line-height css.

It not only does this for paragraphs, it also changes heading tags, like H2 will get changed to a span with style attributes that duplicates the display of h2 but it's a span inside a paragraph tag...

A lot of different developers have worked on this website, but I can't reach them to ask what they did, they probably won't remember anyway.

So I'm asking if anyone else has had this issue and could point me in the right direction. Is it CKEditor config? WYSIWYG config? Drupal config? Version bug? Tried to search Google but don't get much relevant results.

Improve this question

2 Answers 2

Reset to default
1

Fix can be found at https://github.com/RomanMinkin/webkit-span-fix

Caused by a Webkit bug - http://dev.ckeditor.com/ticket/9998

Improve this answer
3
  • fix does not work
    – loparr
    Commented Feb 4, 2014 at 17:00
  • I don't understand one thing, why people say it's webkit bug. It's rather editor JS bug related to Webkit browsers, nope? When i read about Webkit bug, in module description, i start to think that person who wrote that plugin, don't exactly understand things.
    – Rantiev
    Commented Sep 4, 2014 at 8:50
  • It was working fine, then it started in Webkit. A change in Webkit caused the problem as they are looking in to at code.google.com/p/chromium/issues/detail?id=226941
    – jamestsymp
    Commented Sep 4, 2014 at 13:35
1

So i might not have the most informed answer, but i think i have a solution:

I face the same problem on our D7 site.

It turns out, if you use Chrome, content you paste in the WYSIWYG usually gets these strange line-spacings. (Regardless of if you choose "paste as plain text", or copy-paste from Notepad).

Use Firefox - and you wont see any <span style="line-height: 1.538em;"> stuff in the HTML!

If anyone knows how to use Chrome and not have these span elements show up - please let me know!

Cheers,

R

Improve this answer
5
  • Thanks for the suggestion. The problem I'm facing has more to do with editing the text in the editor and getting these junk spans with style attributes. It's not directly related to just pasting. But I'll try Firefox, however there must be a better way. Maybe I'll try TinyMCE
    – Beebee
    Commented Mar 19, 2013 at 8:33
  • When i edit text that has been added earlier with chrome, i see these tags. When the text was added with FF, they aren't present. Let me know your findings too. Thanks.
    – Rehaan
    Commented Mar 23, 2013 at 11:36
  • I had the same issue in Chrome. I now use IE9 and have avoided the span so far.
    – user16662
    Commented Apr 15, 2013 at 20:44
  • same issue here (in Chrome)
    – belgianwolfie
    Commented Apr 18, 2013 at 13:57
  • The other answer is correct, this is a Webkit bug, and a difficult one to work around in JS because of how Webkit behavior differs from what other browsers do (and what is common sense).
    – TwoD
    Commented Dec 11, 2014 at 8:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.