title: css equivalent of first:child to target first <p> in div with heading and img preceding?
body: <p>I want the first paragraph in the div to be larger text than all following paragraphs, however the paragraph is not the first child of the div.  As written on w3schools I thought the following syntax would work, but it doesn't seem to be:</p>
  
  <pre><code>#feature &gt; p:first-child {
      font-size: 22px;
  }
  
  
  #feature p {
      font-size: 16px;
  }
  
  
  &lt;div id="feature"&gt;
      &lt;h2&gt;Feature Name&lt;/h2&gt;
      &lt;img class="featureimg" src="images/whatever.jpg" /&gt;
      &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit.&lt;/p&gt;
      &lt;p&gt;Nam mattis accumsan consequat. Vivamus eu ligula magna. Cras ultrices nisl et justo convallis nec volutpat purus facilisis.Vestibulum eget augue justo, &lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Obviously I can put the p elements in their own div, but that seems like divitis and i'd like to know if there's a more straightforward way to accomplish this!</p>
  
  <p><a href="http://jsfiddle.net/35yYJ/" rel="noreferrer">http://jsfiddle.net/35yYJ/</a></p>