title: Insert a separator in between elements of different width
body: <p>I am trying to develop a JavaScript carousel, which has the following features:</p>
  
  <ul>
  <li>Circular</li>
  <li>Carousel movement starts with mouse hover on prev/next buttons</li>
  <li>Availability of setting visual separator between last and first elements of the carousel</li>
  </ul>
  
  <p>I found this <a href="http://www.enova-tech.net/eng/lab/jmycarousel" rel="nofollow noreferrer">http://www.enova-tech.net/eng/lab/jmycarousel</a> and it's perfectly suitable for me. But I can't put a separator between last and first elements of the carousel, because it's width is smaller than width of normal element. </p>
  
  <p>E.g.</p>
  
  <pre><code>&lt;li width=200&gt;&lt;/li&gt;
  &lt;li width=200&gt;&lt;/li&gt;
  &lt;li width=200&gt;&lt;/li&gt;
  &lt;li width=50&gt;separator&lt;/li&gt;
  </code></pre>
  
  <p>And this carousel believes that every element has the same width (I guess not only this carousel, but many others too), so because of that I am not able to get my carousel working. How do I insert a separator between the first and the last elements? </p>
  
  <p>I tried using jCarousel, but it has a similar problem.</p>