Problems with positioning and divs over jQuery image carousels

This question is related to a page I’m currently coding in HTML/CSS and plan to port over to a WordPress site in the next 24 hours.

My knowledge of Javascript is rudimentary at best (I’m not a coder by trade), but I’m trying to cobble a page together such that there are two divs sitting on top of a jQuery image carousel. This page is the example of what I’m talking about, with this screen grab showing how it should look in proper fighting form.

My first problem was trying to figure out how to do some sort of positioning trickery so that I could throw both the div #cta_imgbox_learnmore and #img_boxout on top of the jQuery carousel, #slideblock. I made a silly additional wrapper div, called box1_home, thinking this would help in that effort (because when I tried to put those divs inside of #slideblock, it screwed up the image cycle in the carousel).

I did some position:relative tomfoolery, only to realize it was pushing the entire #slideblock down the page according to the height of #cta_imgbox_learnmore. Bad news. So of course, I thought giving #slideblock a negative top margin might be a decent way to hack around this.

Once I added the second div #img_boxout though, it all went to hell. The text I’m trying to flow into that div is being pushed to the side, and I had to add even more ridiculous negative margin to the top of #slideblock. Not cool.

So I guess my question is: what’s a better, cleaner, smarter way to do this, that won’t screw up the jQuery carousel?