Centratura verticale del pulsante usando css

Sto provando a creare un semplice pulsante di input al centro all’interno di una cella di tabella.

Il mio markup è:

XXXXXXXXX
YYYYYYYY


E può essere visto qui:

http://jsfiddle.net/tP4sD/

Ho fatto una versione da tavolo che mostra il layout che sto cercando di ottenere. Si noti che il testo rappresentato da “XXXXX” o “YYYYYY” è di lunghezza variabile.

http://jsfiddle.net/8v8gLn4y/

 .container { background: lightblue; display: table; width:100%; } input[type=button] { display: block; width: 50%; margin: 0 auto; } .button-wrapper { background: darkorange; display: table-cell; vertical-align: middle; } 
 
some line with text
another line with text

Se rendi il tuo pulsante un elemento in inline e aggiungi l’ text-align: center al genitore td dovresti stare bene.

Vedi anche: http://jsfiddle.net/c4urself/NucL9/