View Full Version : L shape image with caption?


LostSock
09-07-2011, 07:01 PM
Is there any way to have an L shaped image (it's actually two images that I've combined in photoshop) with a caption in the open space?

I've tried using the non-rectangular image code as provided in the stickied thread, but no matter which one I try, I can't get them to work properly. I'm usually pretty good at figuring things out through instructions, but I just <b>can't</b> get this.

I absolutely appreciate any help, and have attached an example of the image I'm working with.

pholy
09-07-2011, 08:12 PM
I foresee odd things happening when someone resizes the font and your caption no longer fits in your little rectangle... But of course I haven't tried it :)

Perhaps - just a thought - it might be better to Photoshop your caption into the space and make it one simple rectangle. Certainly easier :D

LostSock
09-07-2011, 08:16 PM
That's my back up plan, hahaha!

Jellby
09-08-2011, 03:41 AM
Why don't split the two images and then combine them both and the caption in a <div> with "page-break-inside: avoid"?

LostSock
09-08-2011, 06:26 AM
I'll give it a shot, thanks Jellby!

charleski
09-08-2011, 07:24 PM
Here's something you can try, the size of both the caption and the picture will change with font-size, so it'll stay in place.

PNG with transparency
negative margin on the caption

Obviously you'll have to play around with the numbers and test on a device to make sure you get a set that work for your particular text + picture.