web-dev-qa-db-fra.com

css: comment remplacer la valeur max-width par une valeur plus grande (moins restrictive)

J'ai un fichier css avec ce style:

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

Je voulais augmenter la largeur maximale sans modifier ce fichier css, j'ai donc créé un fichier css personnalisé avec ce style:

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

Dans le volet "html/styles", je constate que les styles sont répertoriés dans le bon ordre:

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

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

Cependant, "max-width: 99%" ne remplace pas "max-width: 70%". Il semble que la valeur la plus restrictive (70%) soit utilisée, même lorsque la valeur la moins restrictive (99%) vient en premier.

Existe-t-il un moyen de remplacer une valeur de largeur maximale par une valeur plus grande (moins restrictive)?

overridingcss
38
moondog

Vous pouvez remplacer (désactiver) la largeur maximale avec

.foo{ max-width:none; }

... pour effacer toute largeur max héritée.

103
Jim Morrison

Essayez d'utiliser !important, ou sélecteur avec la spécificité supérieur.

8
duri

Utilisez JavaScript pour définir max-width à none d'abord, puis réaffectez une nouvelle valeur.

2
pmko

Il s'agit d'un problème de spécificité. Jetez un œil à http://htmldog.com/guides/cssadvanced/specificity/ .

Fondamentalement, vous devez rendre l'un plus spécifique que l'autre. Placez l'élément contenant avant .filefield-element .widget-edit et il sera remplacé

2
Scott Brown