jquerycssdrupaljcarousellite

jCarousel Lite - center images horizontally and vertically

I have jCarousel Lite going in Drupal with images of various sizes/aspect ratios. I'm not having much luck trying to center the images vertically and horizontally (i.e. evenly-spaced). The plugin requires that the images be in a <ul><li><img ... /></li></ul>. I've tried display:inline-block, marginTop:50% among other things, most of which just screw up the carousel.

The carousel is posted at: http://carillontech.org/drupal/

thanks!!

Solution

  • Thanks for the hints. It's sort of a cop out, but the easiest solution has just been to extend the image canvases so that they're all the same size. If the background color ever changes, I'll have to go back and change it in the images (since jpg doesn't do transparency), but at least it works consistently on every browser (unlike CSS).