Text over image

Discussion in 'CSS' started by alphacooler, Sep 11, 2006.

0
  1. #1
    How can I place text over an image without using using absolute positioning? I already tried using z-index and relative positioning, but it kept moving my image as well as the text. Also, I would like to do this without using the image as a background to a div because I need to make the image a link.

    Any ideas?
     
    alphacooler, Sep 11, 2006 IP
  2. SoKickIt

    SoKickIt Active Member

    Messages:
    305
    Likes Received:
    30
    Best Answers:
    0
    Trophy Points:
    70
    #2
    Try negative margins. For example:

    
<img alt="Something" src="Filename.gif" />
<p style="margin-top: -100px;">Text</p>
    HTML:
     
    SoKickIt, Sep 11, 2006 IP
  3. rosiee007

    rosiee007 Notable Member

    Messages:
    3,352
    Likes Received:
    179
    Best Answers:
    0
    Trophy Points:
    230
    #3
    you can set the image as background. That should work.
     
    rosiee007, Sep 11, 2006 IP
  4. math20

    math20 Peon

    Messages:
    1,562
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I think if you set the z-index for the image to -500 and have seperate div's for both of them you will get what you want.

    Good luck!
     
    math20, Sep 16, 2006 IP
  5. ifyn

    ifyn Peon

    Messages:
    47
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    There is a way to Dynamically generate text over base Images, that is of course if you often change the text over that image. It is through the php image funcition you need GD function for that. There are plenty of tutorials available for that. Here is a link from php.net: php.net/manual/en/ref.image.php
     
    ifyn, Sep 16, 2006 IP
  6. phree_radical

    phree_radical Peon

    Messages:
    563
    Likes Received:
    18
    Best Answers:
    0
    Trophy Points:
    0
    #6
    use imagery as background..
     
    phree_radical, Sep 16, 2006 IP