title: Isotope items don't show properly
body: <p>I am trying to get the isotope plugin to work at <a href="http://www.kindervakantiepas.nl/isotope" rel="nofollow">http://www.kindervakantiepas.nl/isotope</a></p>
  
  <p>
  I don't get a nice masonry grid....</p>
  
  <p>This is the code I am using in <code>index.php</code>:</p>
  
  
  
  <pre class="lang-html prettyprint-override"><code>&lt;style type="text/css"&gt;
  /**** Isotope Filtering ****/
  
  #container {
    /* either of these will work for horizontal Isotope layouts */
  
    height: 480px;
  }
  
  
  .item{
      background-color:#33FF00;
      width:200px;
      height:200px;
      margin:10px;
  }
  
  .isotope-item {
    z-index: 2;
  }
  
  .isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
  }
  
  /**** Isotope CSS3 transitions ****/
  
  .isotope,
  .isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
       -moz-transition-duration: 0.8s;
        -ms-transition-duration: 0.8s;
         -o-transition-duration: 0.8s;
            transition-duration: 0.8s;
  }
  
  .isotope {
    -webkit-transition-property: height, width;
       -moz-transition-property: height, width;
        -ms-transition-property: height, width;
         -o-transition-property: height, width;
            transition-property: height, width;
  }
  
  .isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
       -moz-transition-property:    -moz-transform, opacity;
        -ms-transition-property:     -ms-transform, opacity;
         -o-transition-property:         top, left, opacity;
            transition-property:         transform, opacity;
  }
  
  /**** disabling Isotope CSS3 transitions ****/
  
  .isotope.no-transition,
  .isotope.no-transition .isotope-item,
  .isotope .isotope-item.no-transition {
    -webkit-transition-duration: 0s;
       -moz-transition-duration: 0s;
        -ms-transition-duration: 0s;
         -o-transition-duration: 0s;
            transition-duration: 0s;
  }
  
  &lt;/style&gt;
  
  &lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="jquery.isotope.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  
  $(document).ready(function() {
      $('#container').isotope({
      //options
          itemSelector : '.item',
          layoutMode : 'masonry'
      });
  
  });
  
  &lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="container"&gt;
  &lt;?php
  
  include('config.php');
  $conn=new mysqli($hostname,$username,$password,$database) or die ('cannot open database');
  
  $sql='SELECT naamAanbieder FROM activiteit LIMIT 100';
  $result = $conn-&gt;query($sql) or die (mysqli_error($conn));
  
  while ($row = $result-&gt;fetch_assoc()) {
  
      $naamAanbieder = $row['naamAanbieder'];
      echo "&lt;div class='item'&gt;" .$naamAanbieder ."&lt;div&gt;";
  
      };
   ?&gt;
  
  &lt;/div&gt;
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>How can I get Isotope items shown properly?</p>