The Dark Furie

Imposed Captions Test

Don't mind me. I'm just testing out a theory I have about how to create imposed captions in different positions, which can be useful for certain posts. It's not quite done yet, but have a look over. You may find something you can use in there.

Caption Test Text 1

Caption Test Text 2

Caption Test Text 3

Anyone interested in this can find the code below:

<div style="width:100%;height:200px;background:url(http://media.share.ovi.com/m1/s/0983/6da07eaf90c64998addd1695e097f242.jpg) no-repeat;padding:5px;position:relative;"><h1  style="font-size:30px;color:red;width:100%;text-align:center;">Caption Test Text 1</h1><h1  style="font-size:20px;color:white;width:100%;text-align:left;text-shadow:gray 2px 2px 2px;">Caption Test Text 2</h1><h1 style="font-size:40px;color:blue;width:100%;text-align:right;bottom:0;">Caption Test Text 3</h1></div>

As you can see I'm having problems getting the blue caption to go to the bottom and stay within the image. Anyone got any ideas?
sherlock

Who Ya Gonna Call?I Got The Power

Comments

Dacotah Thursday, July 9, 2009 2:20:19 PM

Wish I could help. Sorry.

Moesring Thursday, July 9, 2009 4:41:36 PM

bottom:0 is redundant in the final case. o
I'd try increasing the top margin for the last caption and decreasing (to 0) the bottom margin. up

That won't guarantee it will be at the bottom every time though.

Dark FurieFurie Thursday, July 9, 2009 5:56:00 PM

Yeah, I'm looking for a way to do it without other captions, so I can just whack it on.

Mad Scientistqlue Friday, July 10, 2009 8:33:37 AM

I'd probably have tried using svg for that effect. But it would only work properly with the Opera browsers then as no other browser supports svg properly. (the blue 'e' doesn't support it at all).

How to use Quote function:

  1. Select some text
  2. Click on the Quote link

Write a comment

Comment
(BBcode and HTML is turned off for anonymous user comments.)

If you can't read the words, press the small reload icon.


Smilies