Background color change shown in debugger, but not on screen

Question

I am trying to change the background color of an element. The debugger in Chrome tells me I have done so, but the color does not show up on screen.

This particular element has !important for the background color.

If I try to do the same thing on an element without !important it works.

It does not seem to matter if I do the changes from javascript only, jQuery or the debugger.

I am quite a bit confused at the moment, but perhaps I can guess rather safely assume that there is a bug in either Chrome or its debugger, or?

Maybe it matters that this is in a bookmarklet. (And this prevents me at the moment to even test it in Firefox)

Any ideas are welcome!

Answer 1

Since no code was added, this is just an educated guess... well... 2 guesses:

1. The element has display: inline. Try adding display: block !important (might kill your layout, but is just a test)

2. It has somewhere else, no background with important also, with higher priority.

Answer 2

Have you tried to mark you change as !important? You could try to write inline CSS with !important to see if change, in order to narrow down the problem.