Bug Tracker

Ticket #11173 (closed bug: wontfix)

Opened 3 years ago

Last modified 8 months ago

$(elem).css("property", "value !important") fails

Reported by: fam.lam Owned by:
Priority: low Milestone: None
Component: css Version: 1.7.1
Keywords: Cc:
Blocking: Blocked by:

Description

I'm not sure if this is a bug or intentional, but I guess it's a bug. In the FireFox (9.0.1, and maybe earlier versions too) and future webkit browser versions, the following code doesn't work

$("body").css("color", "red !important");

If you leave out the !important it works fine. See also:  http://jsfiddle.net/GGJHL/

It could be because jQuery calls style[ name ] = value; and these browsers do not support setting properties containing !important that way. The correct way to set it would be style.setProperty(name, value_without_!important, "important");

It would be great if jQuery could also support setting !important styles on browsers that support .setProperty().

Change History

comment:1 follow-up: ↓ 5 Changed 3 years ago by rwaldron

  • Priority changed from undecided to low
  • Resolution set to wontfix
  • Status changed from new to closed
  • Component changed from unfiled to css

It's smarter to avoid adding features to the core library and instead defer to the developer and allow them to create a class that can be used instead:

.importantRed {
  color: red !important;
}

$("body").addClass("importantRed");

comment:2 Changed 15 months ago by anonymous

I like using css and jquery will solve problem

comment:3 Changed 13 months ago by anonymous

If you're not going to fix this please update your docs:

From  http://api.jquery.com/show/:

Note: If using !important in your styles, such as display: none !important, it is necessary to override the style using .css( "display", "block !important") should you wish for .show() to function correctly.

comment:4 Changed 13 months ago by anonymous

This isn't good practice but should at least work or return an error. It simply does nothing.

comment:5 in reply to: ↑ 1 Changed 8 months ago by anonymous

Replying to rwaldron:

It's smarter to avoid adding features to the core library and instead defer to the developer and allow them to create a class that can be used instead:

.importantRed {
  color: red !important;
}

$("body").addClass("importantRed");

This won't work for setting a value that needs to be calculated with JS, such as the height of an element.

Note: See TracTickets for help on using tickets.