I'm developing an artist portfolio that's loosely based on the Hegel theme over at Cargo Collective (example: work.eastforkstudio.com).

I've noticed that the theme has a really solid masonry code written.

The layout is fluid, use of the back button works perfectly, and images load in place without needing to find the right place in the container.

Everytime I try not using a css container the content moves way over to the left side.

I sound pretty lost.....

I'll add that my site's working fine WITH a firm css container but I'd like to see if I could make a go without it.

$(function(){

  var $container = $('#posts');
  var height = $container.height();
  if( height > 0 ) { // or some other number
  $container.height( height );

}

  $container.imagesLoaded(function(){
    $container.masonry({
      itemSelector: '.entry',
    });
  });

  $container.infinitescroll({
    navSelector  : '#nav',    // selector for the paged navigation 
    nextSelector : '#nav a#next',  // selector for the NEXT link (to page 2)
    itemSelector : '.entry',     // selector for all items you'll retrieve
    loading: {
        finishedMsg: 'No more pages to load.',
        img: 'http://static.tumblr.com/rahqboa/R0Vmf30bs/loading.gif'
      }
    },
    // trigger Masonry as a callback
    function( newElements ) {
      // hide new items while they are loading
      var $newElems = $( newElements ).css({ opacity: 0 });
      // ensure that images load before adding to masonry layout
      $newElems.imagesLoaded(function(){
        // show elems now they're ready
        $newElems.animate({ opacity: 1 });
        $container.masonry( 'appended', $newElems, true ); 
      });
    }
  );

});