title: How to add background-image with pseudo before
body: <p>I'm trying to use one image for a list and each li will display different background position, but I can't even get the image to display.</p>
  
  <pre><code>#info li a:before {
  background-image: url(img/about/Capture.png) no-repeat;
  }
  
  #info li:nth-child(1){
  background-size:auto ;
  background-position: 0% -6.9%;
  }
  
  #info li:nth-child(2){
  background-size:auto ;
  background-position: 0% 37%;
  }
  
  #info li:nth-child(3){
  background-size:auto ;
  background-position: 0% 73.4%;
  }
  
  #info li:nth-child(4){
  background-size:auto ;
  background-position: 0% 111%;
  }
  </code></pre>
  
  <p>----EDIT----
  i just realized i dont actually need any pseudo :P lol i can just do it like that : </p>
  
  <pre><code>#info li{
  background: url("img/about/Capture.png") no-repeat ;
  background-size:auto ;
  }
  
  #info li:nth-child(1){
  background-position: 0 -6.9%;
  }
  
  #info li:nth-child(2){
  background-position: 0 37%;
  }
  
  #info li:nth-child(3){
  background-position: 0 73.4%;
  }
  
  #info li:nth-child(4){
  background-position: 0 111%;
  }
  </code></pre>