Classes in a stylesheet override CDN

Question

I'm using Jquery UI (Dialog to be specific)

In my CSS (local) I have my custom class for example the input[type='text'] In CSS there are jQuery UI customizations to the input, but they are overwriting my.

How can I always keep the most suitable as my stylesheet?

I've tried changing the order:

<link href="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.12/themes/pepper-grinder/jquery-ui.css" type="text/css" rel="stylesheet"/>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

But it always loads classes CDN.

Will not you be using !important in all classes.

Is there any way that he always give preference to my CSS file?

Answer 1

You can add more specificity to the CSS definition to override other definitions.

<style>
   div input[type=text] { ... } // more specific, higher weight
   input                { ... } // less specific than previous definition
</style>


<div>
   <input type="text" ... />
</div>

Answer 2

Try being more specific with your query selector. So, if your input[type=text] is in a div, say 'div input[type=text]'. The most specific will always win.