Css: как переопределить значение max-width с большим (менее строгим) значением

У меня есть файл css с этим стилем:

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

Я хотел увеличить максимальную ширину без изменения этого css файла, поэтому я создал собственный 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%).

Есть ли способ переопределить значение max-width с большим (менее строгим) значением?

Ответ 1

Вы можете переопределить (отменять) максимальную ширину с помощью

.foo{ max-width:none; }

... удалить любую унаследованную максимальную ширину.

Ответ 2

Попробуйте использовать !important или селектор со спецификой выше.

Ответ 3

Это проблема специфики. Взгляните на http://htmldog.com/guides/cssadvanced/specificity/.

В принципе, вам нужно сделать еще одну конкретную, чем другую. Поместите содержащий элемент до .filefield-element .widget-edit и он будет переопределен

Ответ 4

Сначала используйте JavaScript, чтобы установить max-width в none, а затем переназначьте новое значение.