title: flexslider responsive carousel problems
body: <p>I need to create a responsive carousel using flexslider. The problem is that one I shrink the browser window below the size of my container, item positions get messed up. </p>
  
  <p>This is a screenshot of the slider on >1200 screen (fine)
  <img src="https://i.stack.imgur.com/kLGdX.png" alt="enter image description here"></p>
  
  <p>This is a screenshot of the slider on >800 screen (!!)
  <img src="https://i.stack.imgur.com/rqYvm.png" alt="enter image description here"></p>
  
  <p>My JS init.:</p>
  
  <pre><code>$('.flexslider').flexslider({
      animation: "slide",
      animationLoop: true,
      touch: true,
      mousewheel: true,
      itemWidth: 400,         
      prevText: "",
      nextText: ""
      });
  </code></pre>
  
  <p>As you can see in image (2), the third image get chopped off. I want to either reduce the number of visible elements to two when the resolution reaches threshold, and make the images adapt to available space so nothing get chopped off. Ideas?</p>