title: Using Jquery Toggle show & hide, but gets weird floating
body: <p>I have no clue how to solve this or what to even look at, I use floating for a bunch of classes and it works great. Also on top of that I made so you can click to show and hide content (inside the class to show the content). My problem, float is just acting weird when the classes are expanding. Because when you click them.
  I was close to launch my new created page but then I saw this! See it in action:</p>
  
  <p><a href="http://epicesports.com/buildorders.php#protoss" rel="nofollow" title="click here">click here to see my page</a>
  Click on the "box" to the right where it says: "Forge Nexus Opening" and see that my bottom "box" (with text saying: "Nexus Forge Opening") is getting putted down and follows with the other box and leaves a gap. How do  I solve this issue? I dont want white space between the boxes.</p>
  
  <p>Jquery used for this. </p>
  
  <pre><code>$(".desccontent").show();
  $(".desccontent").hide();  
  
      $('.buildorderbox').click(function(){
      $(this).children(".desccontent").slideToggle();
      });
  </code></pre>
  
  <p>Each class element got float: left and auto height. Any ideas?</p>