I have divs within each group of slides - there's a div for the image itself, then a navigation div that includes pagination and image captions.  This all works, but when an image that's slightly smaller than the others (vertically) comes up, the div below the image bumps up to fill the gap.  I want to avoid that.

I was hoping that the cycle plugin allowed for some resizing or at least maintaining the image div at a constant size since cycle is providing the image width/height numbers in the img tag.  I tried the various options (containerResize, slideResize, fit) to no effect.

Any clever fixes for that?

Here's the script invocation and an abbreviated chunk of the html containing a set of slides:

1. <script type="text/javascript">
2. jQuery(window).load(function(){ 
3.         jQuery('.slider_3').cycle({
4.                 next:           '.next_3',  
5.                 prev:           '.prev_3',
6.                 contain:        'slidecont_3',
7.                 fx: 'fade', 
8.                 speed: 500, 
9.                 timeout: 2000, 
10.                 delay: -1
11.         });
12. });
13. </script>

1. <div class="design_slider_container slider_3">
2.       <div class="slidecont_3">
3.             <div class="design_image">
4.                   <img width="560" height="393" src="foo.jpg" class="attachment-large" alt="alt text" />
5.             </div> <!-- end design_image -->
6.             <div class="design_image_nav">
7.                   <div class="design_image_caption">
8. the caption
9.                   </div> <!-- end design_image_caption -->
10.                   <div class="design_image_controls">
11.                         <div class="design_image_prev prev_3">&nbsp;</div> 1/10
12.                         <div class="design_image_next next_3">&nbsp;</div>
13.                   </div> <!-- end design_image_controls -->
14.             </div> <!-- end design_image_nav -->
15.       </div> <!-- end slidecont_3 -->
16. ... repeats for each image ...
17. </div> <!-- end slider_3 -->