I must be missing something basic here, but I've tried everything I can think of. I'm using the YUI3 Gallery version of the Carousel and I'm trying to set the height of the carousel. From what I understand, I need to set the height of the individual items and the carousel will set itself to the correct height. However, I can't seem to get that to work after a number of different attempts. Even when I explicitly set the height of the li's child, it gives me this:
Here's my original mark up:
I'm creating the carousel with:
Code:
<div id="carousel" class="yui3-widget yui3-carousel yui3-carousel-horizontal" style="width: 714px; height: 273px;">
<div class="yui3-carousel-nav"> etc... </div>
<ol id="yui_3_2_0_10_129131053213016" class="yui3-carousel-content" style="height: 238px;">
<li style="left: 0px;" class="yui3-carousel-selected">
<div style="height: 630px;">
etc...
<div class="yui3-carousel-nav"> etc... </div>
<ol id="yui_3_2_0_10_129131053213016" class="yui3-carousel-content" style="height: 238px;">
<li style="left: 0px;" class="yui3-carousel-selected">
<div style="height: 630px;">
etc...
Here's my original mark up:
Code:
<div id="carousel">
<ol>
<li>
<div style="height: 630px;">
etc...
<ol>
<li>
<div style="height: 630px;">
etc...
I'm creating the carousel with:
Code:
YUI({
//Last Gallery Build of this module
gallery: 'gallery-2010.10.13-22-23'
}).use('node', "gallery-carousel", "substitute", function(Y) {
var carousel = new Y.Carousel({ boundingBox: "#carousel",
contentBox: "#carousel > ol" });
carousel.render();
});
//Last Gallery Build of this module
gallery: 'gallery-2010.10.13-22-23'
}).use('node', "gallery-carousel", "substitute", function(Y) {
var carousel = new Y.Carousel({ boundingBox: "#carousel",
contentBox: "#carousel > ol" });
carousel.render();
});