title: Magento custom css overridden by parent css - using local.xml
body: <p>I have a simple local.xml that attempts to include a custom wc_styles.css in my head block, to apply for all pages in my Magento site.</p>
  
  <pre><code>&lt;?xml version="1.0"?&gt;
  &lt;layout&gt;
      &lt;default&gt;
  
      &lt;reference name="head"&gt;
          &lt;action method="addItem"&gt;
              &lt;type&gt;skin_css&lt;/type&gt;
              &lt;file&gt;css/wc_styles.css&lt;/file&gt;
          &lt;/action&gt;
  
          &lt;action method="addCss"&gt;&lt;stylesheet&gt;css/wc_styles.css&lt;/stylesheet&gt;&lt;/action&gt;
  
      &lt;/reference&gt;
  
  
      &lt;/default&gt;
  &lt;/layout&gt;
  </code></pre>
  
  <p>When viewing the source of my website, my wc_styles.css is being included above all the parent themes css files (all within the html head tag), so my custom css rules get cancelled out basically. </p>
  
  <p>What is the proper way of getting a custom css to work?</p>
  
  <p><strong>Edit Note:</strong>
  I'm merely trying to make look &amp; feel changes to the Magento 1.9 RWD theme.
  I've created the folders for my subtheme at </p>
  
  <p>\app\design\frontend\wc\default</p>
  
  <p>\skin\frontend\wc\default</p>
  
  <p>My local.xml is placed at:
  \app\design\frontend\warecompare\default\layout</p>
  
  <p>My wc_styles.css is placed at
  \skin\frontend\warecompare\default\css</p>
  
  <p>This is what the source code of my site looks like where u see my wc_styles.css appearing above the parents styles.css</p>
  
  <pre><code>&lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  &lt;title&gt;Home page&lt;/title&gt;
  &lt;meta name="description" content="Default Description" /&gt;
  &lt;meta name="keywords" content="Magento, Varien, E-commerce" /&gt;
  &lt;meta name="robots" content="INDEX,FOLLOW" /&gt;
  &lt;link rel="icon" href="http://localhost/mg1/skin/frontend/base/default/favicon.ico" type="image/x-icon" /&gt;
  &lt;link rel="shortcut icon" href="http://localhost/mg1/skin/frontend/base/default/favicon.ico" type="image/x-icon" /&gt;
  &lt;!--[if lt IE 7]&gt;
  &lt;script type="text/javascript"&gt;
  //&lt;![CDATA[
      var BLANK_URL = 'http://localhost/mg1/js/blank.html';
      var BLANK_IMG = 'http://localhost/mg1/js/spacer.gif';
  //]]&gt;
  &lt;/script&gt;
  &lt;![endif]--&gt;
  &lt;link rel="stylesheet" type="text/css" href="http://localhost/mg1/skin/frontend/base/default/css/et_advancedcompare/noreload.css" media="all" /&gt;
  &lt;link rel="stylesheet" type="text/css" href="http://localhost/mg1/skin/frontend/wc/default/css/wc_styles.css" media="all" /&gt;
  &lt;!-- big heap of javascript includes here--&gt;
  &lt;link rel="stylesheet" href="//fonts.googleapis.com/css?family=Raleway:300,400,500,700,600" /&gt;
  &lt;!--[if  (lte IE 8) &amp; (!IEMobile)]&gt;
  &lt;link rel="stylesheet" type="text/css" href="http://localhost/mg1/skin/frontend/rwd/default/css/styles-ie8.css" media="all" /&gt;
  &lt;link rel="stylesheet" type="text/css" href="http://localhost/mg1/skin/frontend/rwd/default/css/madisonisland-ie8.css" media="all" /&gt;
  &lt;![endif]--&gt;
  &lt;!--[if (gte IE 9) | (IEMobile)]&gt;&lt;!--&gt;
  &lt;link rel="stylesheet" type="text/css" href="http://localhost/mg1/skin/frontend/rwd/default/css/styles.css" media="all" /&gt;
  &lt;link rel="stylesheet" type="text/css" href="http://localhost/mg1/skin/frontend/rwd/default/css/madisonisland.css" media="all" /&gt;
  &lt;!--&lt;![endif]--&gt;
  </code></pre>