Vertical alignment in a div

[Nik Coughin]

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

 

[brucie]

in post: <

--------------------------------------------
xxxxx
xxxxx
xxxxx This text is vertically centered
xxxxx
xxxxx

theres a few different ways to do it. heres one:
http://moreshit.bruciesusenetshit.info/vertically-align-thingy.html

heres another one:
http://www.w3.org/Style/Examples/007/center.html#vertical

or you can use margins/padding

 

[Nik Coughin]

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]

Oops, top-posted. Sorry.

 

[Mark Parnell]

Oops, top-posted. Sorry.

http://home.in.tum.de/~jain/software/oe-quotefix/

 

[Nik Coughin]

http://home.in.tum.de/~jain/software/oe-quotefix/

Thanks

 

[brucie]

in post: <

I already considered resorting to a table cell as
suggested by W3 (!), but didn't like the idea.

using the visual appearance of at table cell (css table model) is not
the same as using a html table.

 

[Lauri Raittila]

in post: <"Nik Coughin" <[email protected]> said:
[vertical-centering]

theres a few different ways to do it. heres one:
http://moreshit.bruciesusenetshit.info/vertically-align-thingy.html

heres another one:
http://www.w3.org/Style/Examples/007/center.html#vertical

or you can use margins/padding

Some more methods here:

http://www.student.oulu.fi/~laurirai/www/css/middle/

 

[delerious]

theres a few different ways to do it. heres one:
http://moreshit.bruciesusenetshit.info/vertically-align-thingy.html

Could you please repost this page? I'm getting a 404 Shit Not Found error.
(I've been out of the country and just got back, which is why I didn't see it
when you first posted it.)

 

[Nik Coughin]

Could you please repost this page? I'm getting a 404 Shit Not Found
error. (I've been out of the country and just got back, which is why
I didn't see it when you first posted it.)

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.