Images Added to jCarousel

I knew the way I’d configured my placeholders wouldn’t work when I added my art because overflow=hidden would clip the height off of the art. To replace my placeholder blocks with images I had to:

  1. Position the images to the bottom of their container ul#carousel (green)
  2. Keep the overflow:hidden on ul#carousel and make the height 100%
  • I did this instead of setting the height to make room for the images because as I changed the height in Chrome the box grew from top to bottom instead of growing from bottom to top like I’d expected. I also positioned it to 0px from the bottom of it’s container, but that did not seem to do anything. So I moved on to set height on the clip.
  • Set overflow:hidden on .jCarousel-clip (yellow) and make it tall enough to not scroll or hide anything vertically
  • Do nothing with .jcarousel-container (orange) which was created by the jCarousel script and serves no purpose
  • Absolutely position .jcarousel-skin-ttm2014 (red) and move it some pixels from the bottom
  • I still need to adjust the position of the arrows more and do a lot of cleaning up in my CSS and the stylesheet from jCarousel.

    I learned a lot about the options for using overflow-x and -y thanks to Stack Overflow and a link I found in a thread there.