Vertical alignment in a div

Discussion in 'HTML' started by Nik Coughin, Jan 21, 2004.

  1. Nik Coughin

    Nik Coughin Guest

    How can I make something in a DIV vertically centered without using tables,
    the CSS equivalent (if there is one) of <td valign="middle">?

    ie:

    --------------------------------------------
    xxxxx
    xxxxx
    xxxxx This text is vertically centered
    xxxxx
    xxxxx
     
    Nik Coughin, Jan 21, 2004
    #1
    1. Advertisements

  2. Nik Coughin

    brucie Guest

    brucie, Jan 21, 2004
    #2
    1. Advertisements

  3. Nik Coughin

    Nik Coughin Guest

    I like your way better. I already considered resorting to a table cell as
    suggested by W3 (!), but didn't like the idea. Scoured Google for this for
    a while, didn't find anything as elegant as that, got sick of wading through
    the irrelevant bullshit. Thanks a heap.
     
    Nik Coughin, Jan 21, 2004
    #3
  4. Nik Coughin

    Nik Coughin Guest

    Oops, top-posted. Sorry.
     
    Nik Coughin, Jan 21, 2004
    #4
  5. Nik Coughin

    Mark Parnell Guest

    Mark Parnell, Jan 21, 2004
    #5
  6. Nik Coughin

    Nik Coughin Guest

    Nik Coughin, Jan 21, 2004
    #6
  7. Nik Coughin

    brucie Guest

    in post: <
    using the visual appearance of at table cell (css table model) is not
    the same as using a html table.
     
    brucie, Jan 21, 2004
    #7
  8. Lauri Raittila, Jan 24, 2004
    #8
  9. Nik Coughin

    delerious Guest

    delerious, Jan 28, 2004
    #9
  10. Nik Coughin

    Nik Coughin Guest

    One of the ways that it was done on that page (I made the original request)
    was something like this:

    ..verticalcenter
    {
    vertical-align: middle;
    }

    ....

    <div>
    <img src="Spacer.png" alt="" height="51" width="0" class="verticalcenter"
    />Some text
    </div>

    The text then appears vertically centered in that div. I think that the
    height of the image is important, I seem to vaguely recall someone saying
    that it had to be taller than the text (makes sense if you want to have
    something to vertically center it against).

    There was another method but the above one worked well for me.
     
    Nik Coughin, Jan 28, 2004
    #10
    1. Advertisements

Ask a Question

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

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.