jquery - SimpleModal containerCSS 在 Firefox 或 Chrome 中不起作用

Question

我尝试覆盖带有containerCSS的simplemodal jquery插件附带的默认STLyesheet中的设置，该插件在IE7中工作正常，但在Firefox或Chrome中不行。不确定这是一个错误还是我做错了什么。

jQuery 代码:

$(document).ready(function() {
    $("#ButtonPopup").click(function() {
        $("#addEditTask").modal({
            onOpen: modalOpen,
            persist: true,
            containerCss: ({ width: "300", height: "200", marginLeft: "-150" })
        });
        return false;
    });
});

HTML 代码:

<button id="ButtonPopup">Popup</button>
<div id="addEditTask" style="display:none;">
     <p>Aliquam nonummy adipiscing augue. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
     Maecenas porttitor congue massa. Fusce posuere, magna sed pulvinar ultricies, purus lectus malesuada
     libero, sit amet commodo magna eros quis urna.</p>
     <button id="ButtonSave">Save</button>
     <button id="ButtonCancel">Cancel</button>
</div>

请参阅this获取可运行的演示以及您可以自行测试的代码的 zip 下载。

Answer 1

基于 Gecko 和 WebKit 的浏览器非常喜欢它们的单元。确保您始终告诉它如何衡量您的值(value)观。

另请注意，如果您想覆盖 css 文件中的内联样式，可以通过在值末尾添加 !important 来实现。

高度:300px!重要；

将覆盖内联样式。

干杯!