Css file not implemented

I was tidying up my css files and put some css styles into a new css file, but when I restarted meteor, the new styles were not being implemented. I copied them back into an existing css file which worked.

If I use !important in the new file, then it works fine but I know this isn’t correct so how do I order the way styles are applied.

if ur having problem with the order of how the files are loading (merged in this css case) give them an alfabetical order or numbering order, something like

_1bar.css
_0foo.css

In this case the _0foo.css is going to loaded first

I am not sure the problem is the order of loading - the css was very simple just defining a color: i.e.

.blue{color:blue;}

it works in an existing file, but only in a new file with !important.

can we see the 2 code files?

I suspect that @narven is correct

0foo.css

 .color{color: red;}

1bar.css

 .color{color: blue;}

html

<p class="color"> will this text be colored blue or red?</p>
<p>The answer is: blue</p>

however, 0foo.css

 .color{color: red !important;}

html

<p>The answer is: red</p>

Sorry Garrilla, if I had used .color{color: red;} then I would agree - but I was using .blue{color:blue;} so that when used in HTML

it should color the font blue. It works but only if I use an existing css file and not a new one.

I’m sorry but the color you used is irrelevant - I used different colours to demonstrate the effects of load order and the !important keyword

use an inspector to see what is styling the element

/i’m-out