Why jQuery/AJAX loaded content does not comply to css?

Why jQuery/AJAX loaded content does not comply to css?

Hi,

I have a menu and a container. when the user clicks a menu item, new content from another file is loaded into the container.

eg. Image

main.php
<html><head>
<link rel='stylesheet' type='text/css' href='main.css'/>
<script src='/scripts/jQuery.js'></script>
<script src='/scripts/jQuery.livequery.js'></script>
<script>
$(document).ready(function() {
  $("#menuitem1").click(function() {
     $("#Container").load("item1content.php?t=" + new Date().valueOf());
  });
});
</script>
</head>
<body>
<table>
<tr>
  <td><a id='menuitem1' href='#'>Change Company Policy</a></td>
  <td><span id='Container'></span></td>
</tr>
</table>
</body></htm>


item1content.php
<p>Company Policy</p><hr/>
<?php /*read policy from file and echo it out*/ ?>


when the contents load dynamically, the css dont comply.. see the fontfamily and font size....
Image

another very gruelling problem is the CSS not loading with kelvinluck's datepicker. Im unable to resize the popup and its very big and irritating....
Image

I tried to reload the css in the "item1content.php" but its not working either....