title: React background image style not working with local images
body: <p>I started looking into react today, and I have run into a problem. In my component's render function I have specified an array as follows, where the image attribute is a url to an image (Nattklunn is intended wrong spelling):</p>
  
  <pre><code>const songs = [{'title' : 'Nattklubb',
                      'author' : 'DigohD',
                      'image' : 'img/Nattklunn.png'},
  
                      {'title' : 'LED Beluga',
                      'author' : 'DigohD',
                      'image' : 'img/LED Beluga.png'},
  
                      {'title' : 'LED Elephantasia',
                      'author' : 'DigohD',
                      'image' : 'http://ovk.no/wp-content/uploads/2012/08/Husmus-Mus-Musculus.jpg'}]
  </code></pre>
  
  <p>Then I render them all using map and the following sub-functions:</p>
  
  <pre><code>function LBoxContent(props){
          return &lt;div className="lBoxContent" style={lContentStyle(props)}&gt;
              {songs[props.index].title}
              &lt;br /&gt;
              {songs[props.index].author}
          &lt;/div&gt;
      }
  
      function lContentStyle(props){
          return {backgroundImage: 'url(' + songs[props.index].image + ')'}
      }
  </code></pre>
  
  <p>All the boxes are created and the title and author for each song are successfully pulled out of the array and listed correctly. However, the background image only works for the web url (third element in array) and not for my local urls. The local urls do work if I use them directly in the css file, however, So they are correctly pointing at the images.</p>
  
  <p>So what am I missing? Are the local urls' format simply incorrect?</p>
  
  <p>Thanks!</p>