Skip navigation.

The Dark Furie

Imposed Captions Test

Thursday, 9. July 2009, 12:29:47

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?Come And Knock On Our Door...

Comments

Dacotah 9. July 2009, 14:20

Wish I could help. Sorry.

Moesring 9. July 2009, 16:41

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.

Furie 9. July 2009, 17:56

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

qlue 10. July 2009, 08:33

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

Download Opera, the fastest and most secure browser

Photos

img13.jpgimg21.jpgimg35.jpgimg53.jpgimg27.jpgimg55.jpgimg47.jpgimg65.jpgimg67.jpgimg39 (1).jpg
December 2009
S M T W T F S
November 2009January 2010
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31

Highlights Of This Page

Blogging & CSS Help

  • My Blog Designs

    This group contains all of the new blog designs I've created for anyone to use.

  • Simplest CSS Template

    The simplest way to customise your blog.

  • Anonymous Comments

    My thoughts on the problems with the currents system used on this site, the problems with any anonymous comment and a way to improve this site's system.

  • Report Bugs And Problems

    A selection of links and help enabling anyone to report problems they have on the site.

  • Brand Identity

    A discussion of the things that can affect how people view you online.

  • Back Up Plan

    What would you do if you lost everything you'd ever written online over six years.

  • Mobile Blogging - How To

    A look at how I've written every post on this page directly from my phone.

  • Mobile Publishing Package

    A collection of mobile applications I put together to help people publish articles online.

  • Only Online

    Even if the thing you've accomplished is only online, why shouldn't you pat yourself on the back over it?

  • Acronyms Code Tutorial

    How to set up acronyms and explanations in your posts.

  • Easy CSS Template

    Extended version of the template I posted a while back.

  • Blog 9 From Outer Space

    You too can aim to have the worst blog in history.

  • Image Resizing

    How to resize a large image just using code.

  • Tags Tutorial

    A quick guide (requested) on how to use tags and why to do so.

  • Text Formatting - Dropcaps

    A guide on how to implement magazine style capital letters to your page.

  • The My Opera CSS Generator

    Tired of your current blog theme but don't know how to change it? Fed up of asking others to make you a new theme? With this generator you'll be able to make your own blog theme easily. I guarantee it.

  • Tips For New Members

    A selection of help for people who're new to the site or blogging in general.

  • Dark Professional Theme

    This theme has been designed for anyone to use. It's a plain black stylish theme that has several different skins regularly released for it. Try it out and see if you can find anything that suits you.