aumento de la altura de jQuery Mobile botones

Question

me gustaría aumentar la altura de unos pocos botones creados en jQuery Mobile, pero CSS como el siguiente no funciona:

a[data-role="button"] { 
    height: 200px; 
    font-size: 48px; 
} 

¿Hay otra manera de hacer esto? ¿Quizás aplique una nueva altura dinámicamente usando jQuery y luego llame a una función para volver a dibujar el botón?

Answer 1

Esto funcionó para mi aplicación móvil jQuery:

.ui-btn { height: 200px; font-size: 48px; } 

pero asegúrese de que el css se produce después de que el jQuery se carga css móvil (en concreto: jquery.mobile.structure.css)

Si todavía le da problemas, trate de envolver los botones en un recipiente y uso:

#container-id .ui-btn { height: 200px; font-size: 48px; } 

Si todavía le da problemas, siempre se puede (no se recomienda) utiliza una importante declaración:

.ui-btn { height: 200px !important; font-size: 48px !important; } 

Pero, de nuevo, en realidad no son recomendables declaraciones "importantes", por lo general sólo uso como chequeos para asegurarse de que estoy seleccionando el elemento de la derecha durante la depuración.

EDIT:

Si desea que la ruta dinámica:

código jQuery:

$(document).ready(function() { 
    styles = { 'height': '200px', 'font-size': '48px' }; 
    $('.ui-btn').css(styles); 
}); 

debería funcionar ... aunque ahora que lo pienso creo móvil jQuery hace algunos javascript procesamiento (sé que envuelve su marcado en un div con una referencia a la URL de la página actual).