I was having the same issue. Found the answer here: http://foundation.zurb.com/forum/posts/1635-orbit-inside-of-reveal-modal...
In your CSS file, specify a minimum height for the class "orbit-container".
.orbit-container {
min-height: 375px;
height:100%;
}
Tweak to suit your needs, in regards to height of the element, default Background color (Should an image not load) or whatever you want really.
EDIT 1: You can also wrap your in a div tag and set your desired height there, the orbit slider should inherit it's height from there.
I have my slider set up as follows. I'm using the data-options tag to customize the slider with the options on this page under the "Advanced" header. Using the syntax from the "Real World Example" header right underneath it:
<ul data-orbit data-options="pause_on_hover:false;
slide_number: false;
timer: false;
variable_height:true;">
<li><img src="http://placesheen.com/725/500" alt="sheen1"></li>
<li><img src="http://placesheen.com/725/900" alt="sheen2"></li>
<li><img src="http://placesheen.com/725/500" alt="sheen3"></li>
</ul>
If you just want to use all of the default settings, you can just get rid of data-options and set it up as follows:
<ul data-orbit>
<li><img src="http://placesheen.com/725/500" alt="sheen1"></li>
<li><img src="http://placesheen.com/725/900" alt="sheen2"></li>
<li><img src="http://placesheen.com/725/500" alt="sheen3"></li>
</ul>
Hope this helps!