I am having problem with Jquery Masonry plugin. Masonry should assemble a group of images like bricks in a wall.  I have a container div wrapping a set of images.  But it's sucking in html objects that follow after the container div.  For example, It's sucking in the header tag that comes after the masonry object as if it were one of the bricks. Example is at http://jsfiddle.net/abehil/vZJLU/32/

1.     <style type="text/css">
           /* masonry */
           body {
               font-family: sans-serif;
           }
   
           #enclosure {
               /*width: 100%;*/
               max-width: 1000px;
           }
   
           /* force vertical scrollbar */
           html {
               overflow-y: scroll;
           }
   
           body {
               margin: 0;
               font-family: sans-serif;
           }
   
   
   
           #container {
               margin-left: 50px;
               background: black;
               max-width: 540px;
           }
   
           /* items are not quite 1/3 wide */
           .item {
               width: 33.2%;
               float: left;
           }
   
               /* images cover up the gap */
               .item img {
                   display: block;
                   width: 100.5%;
               }
   
           /**** Transitions for Masonry ****/
   
           .masonry,
           .masonry .masonry-brick {
               -webkit-transition-duration: 0.4s;
               -moz-transition-duration: 0.4s;
               -ms-transition-duration: 0.4s;
               -o-transition-duration: 0.4s;
               transition-duration: 0.4s;
           }
   
           .masonry {
               -webkit-transition-property: height, width;
               -moz-transition-property: height, width;
               -ms-transition-property: height, width;
               -o-transition-property: height, width;
               transition-property: height, width;
           }
   
               .masonry .masonry-brick {
                   -webkit-transition-property: left, right, top;
                   -moz-transition-property: left, right, top;
                   -ms-transition-property: left, right, top;
                   -o-transition-property: left, right, top;
                   transition-property: left, right, top;
               }
       </style>
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
2.  
           <div id="container">
               <div class="item highlightItem">
                   <img tip-id="Q190" anchor="Q190" src="https://queegtech.3dcartstores.com/assets/images/Articles/XBMC/Lenovo-Q190-plus-remote-2.jpg" />
               </div>
               <div class="item highlightItem">
                   <img tip-id="MX2" anchor="MX2" src="https://queegtech.3dcartstores.com/assets/images/Articles/XBMC/Matricom%20G-Box%20MX2-200.jpg" />
               </div>
               <div class="item highlightItem">
                   <img tip-id="OUYA" anchor="OUYA" src="https://queegtech.3dcartstores.com/assets/images/Articles/XBMC/OUYA-2.jpg" />
               </div>
               <div class="item highlightItem">
                   <img tip-id="NUC" anchor="NUC" src="https://queegtech.3dcartstores.com/assets/images/Articles/XBMC/Intel%20NUC%20black-200.jpg" />
               </div>
               <div class="item highlightItem">
                   <img tip-id="LBB" anchor="LBB" src="https://queegtech.3dcartstores.com/assets/images/Articles/XBMC/TheLittleBlackBox.jpg" />
               </div>
               <div class="item highlightItem">
                   <img tip-id="Veritron" anchor="Veritron" src="https://queegtech.3dcartstores.com/assets/images/Articles/XBMC/VeritronRevo.jpg" />
               </div>
               <div class="item highlightItem">
                   <img tip-id="Chromebox" anchor="Chromebox" src="https://queegtech.3dcartstores.com/assets/images/Articles/XBMC/ASUS Chromebox angle.jpg" />
               </div>
           </div>
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
3.         <a name="a-Veritron"/>
           <h2 id="RevoAndVeritronHeader">Acer Revo and Acer Veritron</h2>
   
   
   
   

4. <script type="text/javascript">
    $(window).load(function () {
    //masonry
   
   
    $(function () {
   
    var $container = $('#container');
   
    $container.imagesLoaded(function () {
    $container.masonry({
    columnWidth: function (containerWidth) {
    return containerWidth / 3
    }
    });
    });
   
    });
    });
    </script>