title: user agent style sheet override my css
body: <p>I want to add a css for the select option disabled.</p>
  
  <p>But my browser compile the user agent stylesheet and not my new css.
  I read that i must be carreful with the doctype. but it seems to be write good.</p>
  
  <p>This is my header</p>
  
  <pre><code>  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
  
      &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
  
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  
      &lt;meta name="description" content=""&gt;
  
      &lt;meta name="author" content="xxxxxx"&gt;
  
  
      &lt;link href="/Content/simple-sidebar.css" rel="stylesheet"&gt;
  
  
      &lt;link href="/Content/font-awesome-4.6.3/css/font-awesome.min.css" rel="stylesheet"&gt;
      &lt;link href="/Content/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet"&gt;
      &lt;title&gt;xxxxxx&lt;/title&gt;
      &lt;link href="/Content/bootstrap.css" rel="stylesheet"/&gt;
  &lt;link href="/Content/Bootstrap-table.css" rel="stylesheet"/&gt;
  &lt;link href="/Content/site.css" rel="stylesheet"/&gt;
  &lt;link href="/Content/justified-nav.css" rel="stylesheet"/&gt;
  
  
      &lt;script src="/Scripts/modernizr-2.6.2.js"&gt;&lt;/script&gt;
  
  
  &lt;/head&gt;
  </code></pre>
  
  <p>And my new css </p>
  
  <pre><code>select option:disabled {
     color:#c09853 !important;
     background-color: #fcf8e3 !important;
      text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
  }
  </code></pre>
  
  <p>Any idea?</p>
  
  <p>Thanks a lot.</p>
  
  <p><strong>EDIT</strong> </p>
  
  <p>This is my compilate CSS on a disabled select option. 
  It seems that my new css is not loaded</p>
  
  <pre><code>element.style {
  }
  *, *:before, *:after {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
  }
  user agent stylesheet
  input[type="button" i]:disabled, input[type="submit" i]:disabled, input[type="reset" i]:disabled, input[type="file" i]:disabled::-webkit-file-upload-button, button:disabled, select:disabled, keygen:disabled, optgroup:disabled, option:disabled, select[disabled] &gt; option {
      color: graytext;
  }
  user agent stylesheet
  option {
      font-weight: normal;
      display: block;
      white-space: pre;
      min-height: 1.2em;
      padding: 0px 2px 1px;
  }
  Inherited from select#lst_5__courtId.input-lg.selectCourtId
  select.input-lg {
      height: 45px;
      line-height: 45px;
  }
  .input-lg {
      height: 45px;
      padding: 10px 16px;
      font-size: 18px;
      line-height: 1.33;
      border-radius: 6px;
  }
  input, button, select, textarea {
      font-family: inherit;
      font-size: inherit;
      line-height: inherit;
  }
  button, select {
      text-transform: none;
  }
  button, input, select, textarea {
      margin: 0;
      font-family: inherit;
      font-size: 100%;
  }
  user agent stylesheet
  select {
      -webkit-appearance: menulist;
      box-sizing: border-box;
      align-items: center;
      white-space: pre;
      -webkit-rtl-ordering: logical;
      color: black;
      background-color: white;
      cursor: default;
      border-width: 1px;
      border-style: solid;
      border-color: initial;
      border-image: initial;
  }
  user agent stylesheet
  input, textarea, keygen, select, button {
      text-rendering: auto;
      color: initial;
      letter-spacing: normal;
      word-spacing: normal;
      text-transform: none;
      text-indent: 0px;
      text-shadow: none;
      display: inline-block;
      text-align: start;
      margin: 0em 0em 0em 0em;
      font: 12.6667px Arial;
  }
  user agent stylesheet
  input, textarea, keygen, select, button, meter, progress {
      -webkit-writing-mode: horizontal-tb;
  }
  Inherited from table.table-hover.table-bordered.table-striped
  table {
      border-collapse: collapse;
      border-spacing: 0;
  }
  user agent stylesheet
  table {
      display: table;
      border-collapse: separate;
      border-spacing: 2px;
      border-color: grey;
  }
  Inherited from body
  body {
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-size: 14px;
      line-height: 1.428571429;
      color: #333333;
      background-color: #ffffff;
  }
  Inherited from html.js.flexbox.flexboxlegacy.canvas.canvastext.webgl.touch.geolocation.postmessage.websqldatabase.indexeddb.hashchange.history.draganddrop.websockets.rgba.hsla.multiplebgs.backgroundsize.borderimage.borderradius.boxshadow.textshadow.opacity.cssanimations.csscolumns.cssgradients.cssreflections.csstransforms.csstransforms3d.csstransitions.fontface.generatedcontent.video.audio.localstorage.sessionstorage.webworkers.applicationcache.svg.inlinesvg.smil.svgclippaths
  html {
      font-size: 62.5%;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  html {
      font-family: sans-serif;
      -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
  }
  Pseudo ::before element
  *, *:before, *:after {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
  }
  Pseudo ::after element
  *, *:before, *:after {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
  }
  </code></pre>