title: Darken css image background
body: <p>The background behind the image without darkening the image.
  Currently I have an html element like this</p>
  
  <pre><code>&lt;div className='new-offers-item-favourite' /&gt;
  </code></pre>
  
  <p>The element has a linear-gradient and an image set to it:</p>
  
  <pre><code>background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) ), url('http://res.cloudinary.com/wisdomabioye/image/upload/v1462961781/about_vbxvdi.jpg') no-repeat center center;
  </code></pre>
  
  <p>which affects the actual image too making it <code>0.3</code> opaque when I need it solid white.</p>
  
  <p>Is there a way to do so w/o wrapping the image to a <code>&lt;div&gt;</code>? Maybe an <code>:after</code> pseudo element. Wish there was a css way.</p>
  
  <p><strong>Update 1.</strong>
  Tried this too. Same effect.</p>
  
  <pre><code>background-image: url('/assets/images/new-offers-tem-favourite.3c611ec2.svg');
  background-color: #000;
  opacity: 0.5;
  </code></pre>