jQuery UI Calendar displays too large, would like the demo size? jQuery UI Calendar displays too large, would like the demo size? jquery jquery

jQuery UI Calendar displays too large, would like the demo size?


I figured it out. It was the font size that was throwing the whole thing off. I added this tag to correctly display the size I wanted:

#ui-datepicker-div { font-size: 12px; } 

Works great if anyone else needs something like this


.ui-widget{ font-size: 0.8em; }

That is the solution, but, what I didn't know is if you put it into the head element like this:

<style type="text/css">.ui-widget { font-family: Lucida Grande, Lucida Sans, Arial, sans-serif; font-size: 0.8em; }</style>

It overrides other settings, so you can still load the google hosted css but use this to override it =)


To fix the size of the calendar control change this:

.ui-widget { font-family: Lucida Grande, Lucida Sans, Arial, sans-serif; font-size: 1.1 em; }

to this:

.ui-widget { font-family: Lucida Grande, Lucida Sans, Arial, sans-serif; font-size: 0.8em; }

For detailed instructions please visit - http://blog.greatdevelopers.com/?p=33