TinyMCE - 外部工具栏位置 [英] TinyMCE - external toolbar position

问题描述

我正在尝试使用TinyMCE创建一个多文本框，点击编辑类型的图形内容编辑器。我有TinyMCE，我可以添加和删除它们的位置和大小，点击编辑它们，等等 - 但有一件事是困扰我，这是工具栏。

我有一个外部工具栏，我试图沿着页面的底部边缘，以及我的保存并关闭按钮和一些其他工具按钮。外部工具栏是由TinyMCE在DIV中用类mceExternalToolbar创建的。我尝试设置 position：fixed 和 left：和 top：属性在页面样式表中，但没有效果 - TinyMCE设置 position：absolute 和 top：-28px DIV当它创建它。

由于项目限制，我无法修改TinyMCE的源代码，但我可以补充额外的CSS文件。

$ b

解决方案

任何人都可以指向正确的方向所提供的样式表中的CSS选择器将覆盖您正在编写的选择器。您需要做的是使用具有更高特异性的选择器来定位工具栏元素：

  body div.mceExternalToolbar {
位置：固定; 
 top：-28px; 
}; 
  

或使用！important 指令覆写it：

  .mceExternalToolbar {
 position：fixed！important; 
 top：-28px！important; 
} 
  

有关选择器特异性和！ ，请参阅 W3C的文档。 / p>

I am trying to work with TinyMCE in creating a multi-textbox, click-to-edit type graphical content editor. I have got TinyMCE to the point where I can add and remove them, position and size them, click to edit them, and so forth - but one thing is bothering me and that is the toolbar.

I have an external toolbar that I'm trying to position along the bottom edge of the page, along with my "Save and Close" button and some other toolbuttons. The external toolbar is created by TinyMCE in a DIV with class "mceExternalToolbar". I tried setting position: fixed and left: and top: attributes in the page stylesheet, but to no avail - TinyMCE sets position: absolute and top: -28px on the DIV when it creates it.

I cannot modify the source code for TinyMCE due to project restrictions, but I can supplement it with extra CSS files.

Can anyone point me in the right direction to get the toolbar positioned properly?

解决方案

The CSS selectors in the provided stylesheets are overriding the selectors that you're writing. What you need to do is either target the toolbar element with a selector of greater specificity:

body div.mceExternalToolbar {
    position: fixed ;
    top: -28px ;
};

Or use the !important directive to override it:

.mceExternalToolbar {
    position: fixed !important ;
    top: -28px !important ;
}

For more detail about both selector specificity and !important, see the W3C's documentation.

这篇关于TinyMCE - 外部工具栏位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！