css：如何使用更大（限制性更小）的值覆盖max-width值

Question

我有一个这种风格的css文件：

.filefield-element .widget-edit {max-width: 70%;}

我想在不修改css文件的情况下增加max-width，所以我用这种风格创建了一个自定义的css文件：

.filefield-element .widget-edit {max-width: 99%;}

在“html / styles”窗格中，我看到样式按正确的顺序列出：

.filefield-element .widget-edit {
    max-width: 99%;
}

.filefield-element .widget-edit {
    float: left;
    max-width: 70%;
}

但是，“max-width：99％”不会覆盖“max-width：70％”。似乎使用了更具限制性的值（70％），即使限制较少的值（99％）首先出现。

有没有办法用更大（限制性更小）的值覆盖最大宽度值？

Answer 1

您可以使用

覆盖（取消设置）max-width

.foo{ max-width:none; }

...清除任何继承的最大宽度。

Answer 2

尝试使用更高特异性的!important或选择器。

Answer 3

这是一个特殊性问题。看看http://htmldog.com/guides/cssadvanced/specificity/。

基本上，你需要比另一个更具体。将包含元素放在.filefield-element .widget-edit之前，它将被覆盖

Answer 4

首先使用 JavaScript 将max-width设置为none，然后重新分配新值。