CSS file in ASP.NET

Question

I know this is a simple question but for some reason I'm wondering if I'm doing something wrong here.

My understanding is that if you declare 2 CSS files

<script type="text/css" src="JQueryUI.css"></script>     
<script type="text/css" src="Override.css"></script>

I want to use the "Override.css" to override some values, so if I type let's say ".ui-accordion" and put my own values, i would expect them to take priority over the original values located under that name on the JQuery.css file.

Mainly because the declaration states that Override.css comes AFTER JWuery.css.

For some reason this is NOT happening.

I tried switching the declaration of the 2 files
...but the Jquery.css seems to ALWAYS seems to take priority.

Any reason why ??

The selectors in jQueryUI.css may have a higher specificity. Have a look at this link. — Zhihao
– Zhihao, Commented Aug 7, 2012 at 0:26
OK...do you know how to change that and simply tell "anything on my override.css" file has higher specificity than ... ? — SF Developer
– SF Developer, Commented Aug 7, 2012 at 0:30
You would actually have to give your selectors in your Override.css file a higher specificity. Or, give your Override.css file the exact same selectors as your JQueryUI.css file, and make sure Override.css is loaded after JQueryUI.css. Another option is to use !important, which would be the "quick and dirty" way of doing it (not recommended). — Zhihao
– Zhihao, Commented Aug 7, 2012 at 0:34
this is the 1s time i hear about Specificity. Not sure how to specify a higher one on the Override.css element (or event better on the entire file). Regarding loading, isn't it enough to specify it after on the declaration ? — SF Developer
– SF Developer, Commented Aug 7, 2012 at 0:41
btw are you really using <script> tags to attach CSS files? Has it ever worked? — haynar
– haynar, Commented Aug 7, 2012 at 0:45

Leonel Machava · Accepted Answer · 2012-08-07 00:49:18Z

3

This is not working because you are not loading correctly the css files.

It should be:

<link rel="stylesheet" href="JQueryUI.css" type="text/css" media="all" />
<link rel="stylesheet" href="Override.css" type="text/css" media="all" />

answered Aug 7, 2012 at 0:49

Leonel Machava

1,51611 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

haynar · Accepted Answer · 2012-08-07 00:51:44Z

2

I am agree with Zhihao about specificity of elements, but I have also noticed that your are using <script> to attach CSS files, use <link> tags instead, maybe that would load your css and it will override existing styles:

<link rel="stylesheet" type="text/css" href="JQueryUI.css" />
<link rel="stylesheet" type="text/css" href="Override.css" />

P.S. just posted my notice in the comment as an answer

answered Aug 7, 2012 at 0:51

haynar

6,0517 gold badges37 silver badges53 bronze badges

Collectives™ on Stack Overflow

CSS file in ASP.NET

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related