Estoy usando el jquery datepicker (http://jqueryui.com/demos/datepicker/).Diseñar el jQueryUI DatePicker
El marcador de fecha en la página de demostración es pequeño y compacto. Sin embargo, cuando uso el datepicker en mi sitio, el calendario es ENORME. Estimaría que cada fecha utiliza una fuente de 12 puntos.
¿Cómo hago que los días sean más pequeños?
La respuesta simple: puede agregar un tamaño de fuente en su CSS a ".ui-datepicker".
Pero creo que es posible que tenga algunas reglas de CSS conflictivas. Debe usar el método del enlace de Paulo para verificar si este es el caso.
¿Está incluyendo jquery-ui.css en sus declaraciones de CSS?
Además, la página de ejemplo tiene un montón de declaraciones de tamaño de fuente en su CSS.
Tienen un tamaño de letra de 10 pt en el cuerpo. Quítelo en Firebug y probablemente verá los mismos tamaños de fuente que su vista en su página.
jQuery UI tiene un theme roller que le permite personalizar uno de los temas existentes, incluidas las fuentes, los colores y los fondos, antes de realizar la descarga. Puede hacer otras cosas como establecer el radio de esquina, los márgenes y el relleno.
Recomiendo tratar de personalizarlo tanto como sea posible antes de descargar, por lo que tendrá menos que jugar al usarlo en su sitio.
Recuerde establecer los tamaños de fuente predeterminados y tal para toda la página después de que ha llamado la hoja de estilo de la interfaz de usuario jQuery.
Ninguna de sus reglas de CSS está en conflicto - ¡Puedo verificar esto con 100% de confianza!
El motivo es que las páginas de demostración de jQuery pueden ser MUY engañosas. Como dijo Seth, sus páginas tienen muchas reglas adicionales de CSS agregadas sobre el CSS de biblioteca predeterminado. Si nos fijamos aquí:
http://jqueryui.com/demos/demos.css
Usted verá que están haciendo el tamaño de la fuente base considerablemente más pequeño, que es la causa real.
Yo también estaba obteniendo el mismo problema exacto en el que obtenía un selector de fechas mucho más grande que el que tenían en su demo. Para confirmar que era SU CSS que era "conflictivo", utilicé el menú CSS de la barra de herramientas de desarrollador web en Firefox para desactivar el archivo CSS mencionado anteriormente solo, y de repente, su sitio de demostración tenía grandes selectores de fecha solo mismo tamaño que el mío.
Por lo tanto, la mejor respuesta aquí es incorrecta - no es nada de tu parte - es completamente como ELLOS han disminuido el tamaño de la base. Te garantizo que si pruebas lo que he mencionado aquí, encontrarás lo mismo.
La línea superior de jquery.ui.theme.css tiene el tamaño de letra:
.ui-widget { font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: .9em; }
Las páginas de demostración tienen un poco de CSS extra para 'fijar' lo que viene en el empaquetado CSS que no mencionan en cualquier sitio. En mi opinión, hacen un mal trabajo explicando esto, especialmente con la cantidad de tiempo que usa el CSS estándar.
Además, el ThemeRoller usa em como valor predeterminado, que es% de una fuente establecida en otro lugar.
De todos modos, las fechas son enlaces, por lo que para que sean más pequeños, establece un tamaño de alrededor de 9px.
Aquí es lo que hago antes de utilizar cualquier jQuery:
h1 {font-size:10px;}
h2 {font-size:11px;}
h3 {font-size:11px;}
p {font-size:11px;}
a {font-size:11px;}
Esto es un poco tarde, pero solamente para referencia futura: Añadir esta entre tu, después de la referencia CSS jQuery UI.
<style type="text/css">
.ui-datepicker { font-size: 9pt !important; }
</style>
y se volverá más pequeño.
@seth - Si no incluía el CSS, el datepicker no sería un datepicker. –