title: Unslider image problems
body: <p>I'm using Unslider to show photos on the home page of a website I'm creating, but the images are surrounded by what looks to be padding - and there is no padding in my css. How can I fix this? It's making my clean gallery look awful.</p>
  
  <p>Unslider plugin found here: <a href="http://unslider.com" rel="nofollow noreferrer">http://unslider.com</a></p>
  
  <p>Here's the HTML:</p>
  
  <pre><code>&lt;div class="banner"&gt;
      &lt;ul&gt;
          &lt;li&gt;&lt;img src="media/duo.jpg" alt="Duo"/&gt;&lt;/li&gt;
          &lt;li&gt;&lt;img src="media/lastshot.jpg" alt="Last"/&gt;&lt;/li&gt;
          &lt;li&gt;&lt;img src="media/rose.jpg" alt="rose"/&gt;&lt;/li&gt;
          &lt;li&gt;&lt;img src="media/r0se.jpg" alt="D"/&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.banner {
  position: relative;
  width: 100%;
  overflow: auto;
  
  font-size: 18px;
  line-height: 24px;
  text-align: center;
  
  color: #FFFFFF;
  text-shadow: 0 0 1px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.3);
  background: #000000;
  box-shadow: 0 1px 2px rgba(0,0,0,.25);
  }
  
   banner ul {
      list-style: none;
      width: 300%;
  }
  .banner ul li {
      display: inline-block;
      float: left;
      width: 33%;
      min-height: 350px;
  
      -o-background-size: 100% 100%;
      -ms-background-size: 100% 100%;
      -moz-background-size: 100% 100%;
      -webkit-background-size: 100% 100%;
      background-size: 100% 100%;
  
      box-shadow: inset 0 -3px 6px rgba(0,0,0,.1);
  }
  </code></pre>
  
  <p>And here's a screenshot of what I'm talking about:
  <img src="https://i.stack.imgur.com/vXSgS.png" alt="enter image description here"></p>