putting text right below an image

Discussion in 'HTML & Website Design' started by seoexpert28, May 10, 2009.

  1. #1
    Hello,

    I am building a site where it will have several images and need to put a description text right below the image but I can't seem to get the text just right below it. I can only get it there but there is like a line in between and I dont want any spaces between the image and the text. (maybe a little but minimun)

    Thanks
     
    seoexpert28, May 10, 2009 IP
  2. kmap

    kmap Well-Known Member

    Messages:
    2,215
    Likes Received:
    29
    Best Answers:
    2
    Trophy Points:
    135
    #2
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    <html>
    <head>
    <title>Test Page</title>
    <style type="text/css" media="screen">
    body
    {
    background-color: black;
    }

    img
    {
    display: block;

    width: 250px;
    height: 70px;
    border: 0;
    margin: 0;
    padding: 0;
    }

    div
    {
    background-color: white;
    border: 0;
    margin: 0;
    padding: 0;
    }

    </style>
    </head>

    <body>

    <img alt="logo" src="abc.jpg">
    <div>text</div>

    </body>
    </html>
     
    kmap, May 10, 2009 IP
  3. RiodaV

    RiodaV Peon

    Messages:
    38
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    In the stylesheet write:

    img{ float: left; }
     
    RiodaV, May 10, 2009 IP
  4. jlhaslip

    jlhaslip Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    You don't say if there is a single image of a group of them.
    Try this layout for multiple images on a page using a floated UL/LI structure.
    There should be enough information there to work out a single image as well.
    Wrap the img and the text inside a div with a width if it is a single image.

    http://jlhaslip.com/samples/gallery/thumbs/index.html
     
    jlhaslip, May 10, 2009 IP