Allowing empty divs in TinyMCE


I'm having some trouble getting TinyMCE (EPiServer 7.13.1) to allow empty div elements.

I've tried creating a TinyMCEPluginNonVisual-class and configuring extended_valid_elements, but that fails for div specifically. When doing the exact same thing for a different element name ("divi" in the example below), that works so I assume there's some default configuration for div that conflicts with my extended configuration. Any ideas what I'm doing wrong?

   [TinyMCEPluginNonVisual(AlwaysEnabled = true,
     PlugInName = "TinyMceExtendedValidElements",
     DisplayName = "Customized editor",
     Description = "Custom editor without h1, h4, h5 and with extra css classes for layout",
     EditorInitConfigurationOptions = @"{
        theme_advanced_blockformats : ""p,h2,h3"",
        extended_valid_elements: ""iframe[src|frameborder=0|alt|title|width|height|align|name], div[id|class|style], divi[id|class|style]"",
        body_id : ""mainbody""}")]
    public class EditorSettings { }

Also, here's the relevant row from EPiServer.config:

The reason we need empty div tags is due to embed codes from external systems.

Oct 20, 2014 12:49


I know this is an old post but we have the same issue with TinyMCE. It seems to be a bug in TinyMCE and has been fixed.

TinyMCE bug: and and Git hub fix :

What makes it strange is that EPiServer says the current TinyMCE version is 3.5.11 ( ) so that should indicate that the bug shouldn't be there anymore. But when looking at the EPiServer tiny_mce_src.js it says version 3.9.3 and release date 2010-12-20 but the fix is done 2012! So something isn't correct here.

We found 2 workarounds for our 3rd party code. Replace the div element with p element. Other workaround is to add an empty p element inside the div so that it wont get removed and also wrap the script element inside div as otherwise it will be wrapped inside p element. Like following:

<div data-somecustomvar="1234567890" style="width:400px; height:283px;" class="someclass"><p> </p></div>
<script type="text/javascript" src="//" async="true"></script>
Feb 11, 2015 7:09


Just ran into this issue myself. I think I finally found a solution (after banging my head against the wall for some considerable time).

We're on CMS 8.0 and our TinyMCE is version 3.9.3.


See the last 2 control characters in the table: "-" and "#". The minus sign removes empty elements, the hash 'pads' them with a non-breaking space.

Now have a look at the default rule set, which includes "-div"! So I tried adding #div[*] to the extended_valid_elements, like so:

  [TinyMCEPluginNonVisual(AlwaysEnabled = true, ServerSideOnly = true, EditorInitConfigurationOptions = "{ extended_valid_elements : '#div[*]' }")]
  public class TinyMCEExtendedValidElements

Seems to work okay - as mentioned it just adds a &nbsp; in the empty element.

Jul 15, 2015 6:48
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.