Cleartype text rendering strangely

Cleartype text rendering strangely

Hi there,

I've written the following code for a kind-of accordion:

jquery
jQuery(document).ready(function(){
   $(".question").click(function() {
      $(this).next().toggle("medium");
   }).next().hide();

   $(".expand_all").click(function() {
      $(".question").next().show("medium");
   });

   $(".collapse_all").click(function() {
      $(".question").next().hide("medium");
   });

   });


html

<p><span class="expand_all"><a href="#">expand all</a></span> | <span class="collapse_all"><a href="#">collapse all</a></span></p>
<p class="question">This is a question</p>
<div class="answer">
   <p>This is an answer</p>
</div><!--end question-->

<p class="question">This is a question</p>
<div class="answer">
   <p>This is an answer</p>
</div><!--end question-->

<p class="question">This is a question</p>
<div class="answer">
   <p>This is an answer</p>
</div><!--end question-->


When viewed in IE6 with cleartype turned on, the text becomes ugly for a second whilst the accordion moves. I have found this page which explains how to fix this, but I can't figure out how to integrate it with work with my code. Can anyone advise me how to do it?

Many thanks,

Katie