Menu icon Foundation
White space between orbit slides

I've got an orbit slider that shows white space between slides. I'm stumped as to why this is happening.

* there is no padding/margin being applied
* the images are all exaclty the same size and dimensions
* the white space is not uniform - it sometimes appears wider, and sometimes doesn't appear at all.

Any thoughts?

<ul class="orbit dishes" data-orbit data-options="timer: false; timer_container_class: hide; timer_paused_class: paused; timer_progress_class: hide; slide_number_class: hide; bullets: false;">
  <li>
    <div>
      <img src="/images/rooms-01@2x.jpg">
    </div>
  </li>

  <li>
    <div>
      <img src="/images/rooms-02@2x.jpg">
    </div>
  </li>

  <li>
    <div>
      <img src="/images/rooms-03@2x.jpg">
    </div>
  </li>

</ul>
            

         

Screen shot 2014 01 29 at 2.22.18 pm

Orbitsliderpaddingimages

I've got an orbit slider that shows white space between slides. I'm stumped as to why this is happening.

* there is no padding/margin being applied
* the images are all exaclty the same size and dimensions
* the white space is not uniform - it sometimes appears wider, and sometimes doesn't appear at all.

Any thoughts?

<ul class="orbit dishes" data-orbit data-options="timer: false; timer_container_class: hide; timer_paused_class: paused; timer_progress_class: hide; slide_number_class: hide; bullets: false;">
  <li>
    <div>
      <img src="/images/rooms-01@2x.jpg">
    </div>
  </li>

  <li>
    <div>
      <img src="/images/rooms-02@2x.jpg">
    </div>
  </li>

  <li>
    <div>
      <img src="/images/rooms-03@2x.jpg">
    </div>
  </li>

</ul>
            

         

Screen shot 2014 01 29 at 2.22.18 pm
Rafi Benkual over 5 years ago

I made a codepen with your code and slowed down the transition. I see a tiny whitespace but its really hard to tell at faster speeds. Removing the <div's in the <li's seems to clean it up.

http://cdpn.io/vmqhu (click edit pen to see code)

Alan Smithee over 5 years ago

Thanks, I'll try removing the divs, they proably don't belong there.