Here's my markup (live repro):
<body>
<div style="text-align:center">header <input class='datepicker'/></div>
<table><tr><td>really wide table.....................</td></tr></table>
</body>
When the datepicker is activated, the header div's width changes from the width of the screen to the width of the table (larger). This causes the header's centered contents to shift to its new center...which is very annoying.
This occurs in IE6 but not in FF3.5, IE8, or IE8-compat-mode.
What's the best way to fix the width of the header div to the width of the window (not the content)?
Note: there is probably a much simpler example than the datepicker--probably something that doesn't involve jQuery--that's just the trigger that hit me so I'm posting it that way. Here's an example that adds a dom element without triggering this problem.