Best way to create a div with Label: Textbox and have it nicely centered?

Question

What's the best way to have the following?

Name:  [Textbox]

Inside a div? I find that the Name: part doesn't center nicely with the textbox, especially with a small font. I want the Name: part to be centered vertically.

In some cases, the left hand part can be quite long and wrap onto multiple lines, like this:

All known
addresses:   [Textbox]

Again, I would like the left hand part nicely centered.

I'm trying to stop using tables for layout, and move onto divs so I can do things properly, but I am having some issues. style="vertical-align:middle" doesn't seem to do anything.

Answer 1

There is no good way to do this. There's a decent writeup on some methods here, but most of them rely on hacking-around fixed-height elements, or using table/table-cell layouts on divs.

If having things centered is a hard requirement, I'd just give up and use tables

Answer 2

use tables or 2 divs: one for the label and another for your text box, so you'll be able to align them properly.