Question

Have a look at this page. The datepicker itself (called on <div id="calendar">) has a width of “68em” set initially. I then use $("#calendar").children().css("width","auto"); to set the width to auto (so it fills up the page). As you can see, this works. Changing the month (with the buttons), however, causes jQuery to change the width back. Is there a right way to fix this?

Answer 1

The quick and dirty solution is to use ! important to overwrite the styles set on the element:

#calendar .ui-datepicker-inline {
    width: auto ! important
}

This is not pretty, but it get’s the job done without too much of a fuss.