Question

I am developing an addon to Firefox using addon-builder. I want to replace a normal alert box in Javascript with my addon. So, I have choosen customized alert boxes using jQuery. The jAlert details are given here.

Now, I made customized alerts (with title and colors in alert). It is wroking properly on some websites. But on some websites the default CSS is dominating my jQuery CSS, which leads to unexpected alerts (ugly alerts).

Answer 1

Not the best solution, and I usually avoid this, but it works nonetheless.

The !important keyword used in your CSS will force it to override any other current setting.

i.e. Normal

.example {
    font-size: 14px;
}

i.e. Forced

.example {
    font-size: 14px !important; 
}

However, try and find out what CSS style is conflicting, and perhaps change the order of it applied or the naming (if that’s a common parameter).