CKeditor 自定义样式下拉列表 - 浮动

Question

我正在使用 CKEditor 版本 4。我正在制作自定义样式。问题是，当样式显示在下拉列表中时，任何带有 float:right 的样式都会像这样在显示屏上移动：

Item 1
Item 2 
            FLoat right item
Normal Item

我一直在尝试覆盖样式，但它不起作用。它们是用 JavaScript 动态创建的，我什至不确定类名会影响这一点。

有人知道我该如何解决这个问题吗？

我的样式代码是这样的：

{ name: 'Image 25% Right', element: 'span', attributes: { 'class': 'img_right_25' } },
{ name: 'Image 25% Left', element: 'span', attributes: { 'class': 'img_left_25' } },
{ name: 'Image 50% Right', element: 'span', attributes: { 'class': 'img_right_50' } },
{ name: 'Image 50% Left', element: 'span', attributes: { 'class': 'img_left_50' } },

然后

.img_right_25 {
    float:right;
    margin-left:10px;
}
.img_left_25 {
    float:left;
    margin-right:10px
}

Answer 1

在 editor.css 中，尝试添加如下规则：

.cke_panel_listItem * {
    float:none !important;
}

然后刷新页面（确保没有从缓存中使用 editor.css 的旧内容！）。

这是试图做的（我还没有测试过）是强制.cke_panel_listItem 下的每个后代元素具有“无”的浮点值。 !important 应确保该规则不能被后续样式定义覆盖，因此 JS 所做的样式被忽略。