如何阻止Wordpress TinyMCE剥离空html标签的内容，例如<div class =“any class”> </div>

Question

我在Wordpress帖子中的两列中显示了一些内容，所以我有两个div显示一半：

<div class="half">Left column.</div>
<div class="half last">Right column.</div>

但当然我也需要清除这一点，之后我通常会这样做：

<div style="clear:both;"></div>

但是每当我保存文章或查看可视化编辑器以及任何其他空的html标签时，这一点都会被删除。图标。有更好的方法吗？

Answer 1

是的，我建议使用Clearfix技术：

请参阅：

• Webtoolkit
• CSS Tricks

Answer 2

最好的方法是添加一个clearfix类，但是如果你绝对必须有那个额外的空元素，那么添加＆amp; nbsp;明确的div。 WordPress正在剥离空div。

Answer 3

有一个插件，可以添加一个按钮来打印<br style="clear: both;">到页面。此标记不会被剥离（请参阅https://codex.wordpress.org/Wrapping_Text_Around_Images#Clear_The_Display）。

在http://wordpress.stackexchange.com上查看此答案，获取该插件的链接：https://wordpress.stackexchange.com/a/255386/48203

Answer 4

要停止TinyMCE删除空元素，请考虑添加一个不间断的空格，例如

<div class="clearfix">&nbsp;</div>

Wordpress TinyMCE删除没有内容的任何HTML标记。同样的规则适用于图标或其他任何东西，例如：

<i class="fa fa-icon">&nbsp;</i>

另外，我强烈建议大家使用现代CSS技术，例如：

.last:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}