css: Como centrar texto verticalmente en input

B

Pues eso, tengo un imput tal que:

<input id="Enter" type="button" value="Enter" onclick="SendForm()"/>

dentro de un form.

La cuestion es que el tipo de letra lo he ampliado a 200% para que se vea bien, sino sale minusculo, el problema es que el texto se va por debajo del boton, y no hay forma humana de centrarlo verticalmente...

¿Alguien sabe como se hace eso?

catalon

Pruedes poner el css?? Porque si le das font-size:200% a un input el texto siempre esta centrado verticalmente. Asi que no se.. pon el css a ver.

1 respuesta
B

#2 Gracias por contestar...

#Enter
{
font: 200% Gabriola;
color: white;
background-color: #a7dbd8;

position: absolute;
top: 89px;
left: 772px;

width: 124px;
height: 36px;

}

Vale, veo que lo que le afecta es que hago el boton menos alto..., ¿alguna solucion?

eXtreM3

Poniéndole 76px de alto al botón ya sale centrado, pero no es lo que buscas supongo. Creo que el problema es de la fuente, que deja mucho espacio arriba y abajo.

Puedes hacerte el botón en photoshop y pones el texto donde quieras.

1 respuesta
B

#4 No, quiero el ancho que esta definido, y si, puedo hacer una imagen y ponerla de fondo, pero no quiero usar ancho de banda si no es estrictamente necesario, prefiero una solucion mas logica como poner el texto donde se necesita, cosa que no se hacer en este caso.

eXtreM3

Es que no sé si con ese alto de botón puedes centrar esa fuente... Hombre, una opción muy burra que puedes hacer con html y css es hacerte un div absolute justo encima del botón, le pones un z-index mayor que al div del botón, y lo bajas con top. xD

B

Dios, vaya pollo, ¿no hay otra forma?, de verdad que no entiendo como esto es tan jodidamente retorcido..., a veces pienso que lo diseñaron subnormales.

NeB1

#1 vertical-align:middle; no te lo soluciona?

¿Y jugando con padding-bottom y padding-top? de todas formas por lo general el tamaño de la letra en un input button debería salir centrado creo, si no es así supongo que será por el height del botón también... Si pones un enlace a donde podamos verlo podré toquetear con el firebug

scumah

Prueba

line-height: 36px;

Usuarios habituales