Css 元素有时在Firefox上不可见

我的页面上有一个元素在Chrome中是可见的，但在Firefox中却消失了，尽管它使用的tinymce库显然有意让它可见

该元素是中的按钮：

<div class="mce-reset" role="application">
    <div id="mceu_17-head" class="mce-window-head">
        <div id="mceu_17-title" class="mce-title">Add Parshan Link</div>
        <button class="mce-close" aria-hidden="true" type="button">×</button>
        <div id="mceu_17-dragh" class="mce-dragh"></div>
    </div>
    ...

我发现如果我加上

padding: inherit;

对于元素的样式，则该元素始终可见，但填充不正确

我还看到CSS被加载了两次，这是不正确的，但可能不是导致问题的原因

有谁能告诉我是什么导致元素不可见（它在那里，可以点击，但我看不到它）？要查看问题，请转到，单击“同意I.B.”字样，然后单击文本上方工具栏中的“Parshan”按钮。对话框右上角有一个我在Firefox（最新版本：37.0.2）中看不到的按钮

另请注意：当我通过Firefox检查元素时，x通常会立即出现

我运行的是64位Windows 8.1，但问题有时也会在Windows 7上出现

---

非常感谢

最后，下面的LESS导致X出现在正确的位置，尽管我猜这只是一个解决办法，因为我仍然不知道是什么导致了问题：

.mce-window-head .mce-close {
    padding: inherit;
    box-shadow: none;
    .mainContainer.ltr ~ div & {
        top: 0px;
        /* @noflip */ right: 0px;
    }
    .mainContainer.rtl ~ div & {
        top: 0px;
        /* @noflip */ left: 0px;
    }
}

.mce-window-head .mce-close {
    padding: inherit;
    box-shadow: none;
    .mainContainer.ltr ~ div & {
        top: 0px;
        /* @noflip */ right: 0px;
    }
    .mainContainer.rtl ~ div & {
        top: 0px;
        /* @noflip */ left: 0px;
    }
}