Can't alter DatePicker font size
Hi all,
I'm using the datePicker widget on a page, but having trouble with the
font size of its contents.
My site's core CSS file has a rule which sets body {font-size: 62.5%}
This alters the width of div.ui-datepicker-inline appropriately, and
the size of the prev/next items in the header, but doesn't change the
font size of the month/year select elements in the header, or the
individual day/date cells in the table.
This means that the date cell rows are too wide for the datepicker div
so overrun the side of it.
If I use a non-inline datepicker (my actual objective), I get similar
behaviour, except that not even the datepicker div alters its size.
What am I missing?
I'm testing with jQuery 1.2.6, jQuery UI is 1.5.2, Firefox 3.0.1
If I use IE6 then all of the header sizes are altered fine, but
neither of the datepicker divs or any of the table cells are altered.
Here is my test case:
<html>
<head>
<script src='/scripts/jquery.js' type='text/javascript'></script>
<script src='/scripts/ui.datepicker.js' type='text/javascript'></
script>
<link rel='stylesheet' href='/jquery-ui-themeroller.css' type='text/
css' />
<style type="text/css">
body {font-size:62.5%}
</style>
</head>
<body>
<script type='text/javascript'>
$(document).ready(function() {
$(".datepicker").datepicker();
});
</script>
<div class='datepicker'></div>
<div style='clear:both'></div>
<div>
<input type="text" class='datepicker' />
</div>
</body>
</html>
Anybody able to shed any light?
TIA,
--rob