Question

In my firefox extension I created a div element and added to it a paragraph with id named myP.

In the css file I wrote:

#myP
{
    color: red;
    text-align: center;
    font-size: 16px;
    font-weight: 900;
    margin: 7px 7px; 
} 

but only the first two properties applied to the paragraph.

I tried to set the three others properties in my js code:

myP.style.fontSize = "16px";
myP.style.fontWeight = "900";
myP.style.margin = "7px 7px";

and it worked perfectly.

how can it be?

Answer 1

Maybe there is something else that is overriding your styles, can you inspect it in any way?

Have you tried:

#myP
{
    color: red;
    text-align: center;
    font-size: 16px !important;
    font-weight: 900 !important;
    margin: 7px 7px !important; 
}