How to do this TD trick with CSS

Discussion in 'HTML' started by Michael Laplante, Jun 1, 2006.

  1. One advantage of tables is that images and text in a TD will "stick"
    together. New and unrelated text can be entered in a new row and it won't
    back up into the image and text in the previous row, i.e.

    <tr>
    <td>
    <left aligned image> Some text here.
    </td>
    </tr>
    <tr>
    <td>
    I want this text either immediately below the image OR the text of the row
    above depending on which one takes up more screen height.
    </td>
    </tr>

    (Hope that makes sense.)

    How do I accomplish the same thing with CSS?

    I've tried the following:

    <DIV>
    <left aligned image> Some text here.
    </DIV>
    <DIV>
    This text here appears immediately below the text in the div above and to
    the right of the left-aligned image. Not what I want. . .
    </DIV>

    I also tried encasing the text and images within paragraph blocks within the
    divs and that didn't work either.

    M
     
    Michael Laplante, Jun 1, 2006
    #1
    1. Advertising

  2. Michael Laplante

    dorayme Guest

    In article <94Jfg.6335$JX1.363@edtnps82>,
    "Michael Laplante" <> wrote:

    > One advantage of tables is that images and text in a TD will "stick"
    > together. New and unrelated text can be entered in a new row and it won't
    > back up into the image and text in the previous row, i.e.
    >
    > <tr>
    > <td>
    > <left aligned image> Some text here.
    > </td>
    > </tr>
    > <tr>
    > <td>
    > I want this text either immediately below the image OR the text of the row
    > above depending on which one takes up more screen height.
    > </td>
    > </tr>
    >
    > (Hope that makes sense.)
    >
    > How do I accomplish the same thing with CSS?
    >
    > I've tried the following:
    >
    > <DIV>
    > <left aligned image> Some text here.
    > </DIV>
    > <DIV>
    > This text here appears immediately below the text in the div above and to
    > the right of the left-aligned image. Not what I want. . .
    > </DIV>
    >
    > I also tried encasing the text and images within paragraph blocks within the
    > divs and that didn't work either.
    >
    > M


    You have the image floated left, the text will naturally go to
    the right, you can control the situation with margins and
    padding. There are complications but do it first and then mention
    any problems you have.

    --
    dorayme
     
    dorayme, Jun 2, 2006
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Nuri Yilmaz

    A .Net trick everyday!

    Nuri Yilmaz, Jul 28, 2004, in forum: ASP .Net
    Replies:
    0
    Views:
    401
    Nuri Yilmaz
    Jul 28, 2004
  2. Nuri YILMAZ

    A .Net trick everday!

    Nuri YILMAZ, Aug 9, 2004, in forum: ASP .Net
    Replies:
    0
    Views:
    443
    Nuri YILMAZ
    Aug 9, 2004
  3. valentin tihomirov

    Is this trick with reset acceptable?

    valentin tihomirov, Apr 11, 2004, in forum: VHDL
    Replies:
    6
    Views:
    564
    Jim Lewis
    Apr 14, 2004
  4. Stephajn Craig

    Perhaps an XML file might do this trick?

    Stephajn Craig, Jun 26, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    448
    Stephajn Craig
    Jun 26, 2003
  5. Kabuki Armadillo

    Best css hack / trick to recommend?

    Kabuki Armadillo, Jun 23, 2008, in forum: HTML
    Replies:
    76
    Views:
    1,925
    Harlan Messinger
    Jun 27, 2008
Loading...

Share This Page