如何仅覆盖页面上一个区域的CSS Box Sizing？ [英] How to override CSS Box Sizing for just one area on page?

问题描述

我的Twitter Bootstrap文件中包含以下CSS：

I have the following CSS inside my Twitter Bootstrap file:

*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

这会导致我的TinyMCE编辑器出现问题，主要是调整文本区域的大小。无论如何，如果我删除了上面的代码，一切都很好，但是显然我需要就位，否则会导致其余的Bootstrap中断。

It is causing a problem with my TinyMCE editor, mainly the resizing of the textarea. Anyway if I remove the above code all is good, but obviously I need it in place cause otherwise the rest of Bootstrap breaks.

所以我如何仅覆盖上面的代码TinyMCE？我尝试过这个：

So how do I override the above for just TinyMCE? I tried this:

.tinymce-editor,
.tinymce-editor:before,
.tinymce-editor:after {
    -webkit-box-sizing: content-box !important;
    -moz-box-sizing: content-box !important;
    box-sizing: content-box !important;
}

但是没有运气。 .tinymce-editor 恰好是我的编辑器所在的div。

But no luck. .tinymce-editor happens to be the div that my editor is inside.

推荐答案

没关系了

.tinymce-editor *,
.tinymce-editor *:before,
.tinymce-editor *:after {
    -webkit-box-sizing: content-box !important;
    -moz-box-sizing: content-box !important;
    box-sizing: content-box !important;
}

这篇关于如何仅覆盖页面上一个区域的CSS Box Sizing？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！