The following seemed to do the trick (but I am not sure):
.ui-datepicker {
width: auto;
padding-top: 2.6em;
}
.ui-datepicker .ui-datepicker-header {
position: absolute;
top: 0.2em;
left: 0.2em;
right: 0.2em;
}
.ui-datepicker table {
width: auto;
}
I have:
- Made the outermost div auto width (to override hard-coded width)
- And added top padding (see below)
- Made the header absolute positioned since
- Neither 100% nor auto width worked in IE7 (under given conditions) so used
left: 0
+right: 0
- The top padding occupies the room needed for the header
- Neither 100% nor auto width worked in IE7 (under given conditions) so used
- The table is set to auto width as 100% does not seem to work in IE7 (under given conditions)