Tumblr layout with annoying spaces! Options

[jasmin12e]

So, i've been trying to take apart this tumblr layout to no avail to try and figure out why it started having horrendous spacing
the link is

http://lovelessbeat.tumblr.com/



As you can see there's a large space between my reblogs is it possible to remove them?
I'll paste the code

<!-- DEFAULT VARIABLES -->
<meta name="color:Background" content="#CCC"/>
<meta name="color:Quote background" content="#F5F5F5"/>
<meta name="color:Photoset background" content="#EEE"/>
<meta name="color:Question background" content="#EEE"/>
<meta name="color:Box" content="#FFF"/>
<meta name="color:Blog Title" content="#999"/>
<meta name="color:Text" content="#000"/>
<meta name="color:Link" content="#293e6f"/>
<meta name="image:Background" content=""/>
<meta name="image:Sidebar" content=""/>
<meta name="if:Show Title" content="0"/>
<meta name="if:Show Photo" content="0"/>
<meta name="font:Title" content="Times New Roman"/>
<meta name="if:Show Twitter" content="0"/>
<meta name="text:Twitter Username" content="twitter"/>
<meta name="color:Twitter Shell Background" content="#F5F5F5"/>
<meta name="color:Twitter Shell Color" content="#9e9e9e"/>
<meta name="color:Tweets Background" content="#FFFFFF"/>
<meta name="color:Tweets Color" content="#908e94"/>
<meta name="color:Tweets Links" content="#555555"/>



{block:indexpage}
{block:NextPage}<div id="page-nav"><a href="{NextPage}"></a></div>{/block:NextPage}


<script>
jQuery(window).load(function(){
var $wall = $('#posts');
$wall.imagesLoaded(function(){
$wall.masonry({
singleMode: true,
columnWidth: 279,
itemSelector: '#space'
});
});
$wall.infinitescroll({
navSelector : '#page-nav',
nextSelector : '#page-nav a',
itemSelector : '#space',
},

function( newElements ){
$(newElements).hide();
setTimeout(function(){
$wall.masonry({ appendedContent: $(newElements) });
},2000);
setTimeout(function(){
$(newElements).fadeIn('slow');
},2100);
},1000);
});
</script>

<script>
$.fn.imagesLoaded = function(callback){
var elems = this.find('img'),
len = elems.length,
_this = this;
if ( !elems.length ) {
callback.call( this );}
elems.bind('load',function(){
if (--len <= 0){
callback.call( _this );}
}).each(function(){
// cached images don't fire load sometimes, so we reset src.
if (this.complete || this.complete === undefined){
var src = this.src;
// webkit hack from http://groups.google.com/group/jquery-dev/...ee6ab7b2da50e1f
// data uri bypasses webkit log warning (thx doug jones)
this.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
this.src = src;}
});
return this;};
</script>

{/block:Indexpage}

<style type="text/css">

body{margin:0px; background-color:{color:Background}; background-image:url({image:Background});
background-attachment: fixed; background-repeat: repeat; font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", serif; font-size: 10px; line-height:16px; color:{color:text};}

a:link, a:active, a:visited{color: {color:Link}; text-decoration: none; -webkit-transition: color 0.3s ease-out; -moz-transition: color 0.3s ease-out; transition: color 0.3s ease-out;}

#center{position:relative; width:558px; margin: auto; overflow:auto; overflow-y:hidden; margin-top: 50px;}

#posts{
{block:IndexPage}width: 550px {/block:IndexPage} {block:PermalinkPage} margin: auto; width:542px; {/block:PermalinkPage} height: auto; margin-bottom 0px;}



#side{position: fixed; width: 175px; top: 175px; margin: 7px; margin-left: -196px; background-color:{color:box}; padding: 7px; height: auto; -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.1);-moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.1);box-shadow: 0px 0px 5px rgba(0,0,0,0.1); text-align: justify;}

#space{
{block:IndexPage}float: left; width: 250px; background-color:{color:box}; margin:3px; padding: 3px;{/block:IndexPage}

#space .perma{position: absolute; width:250px; font-family: Times New Roman; height: 0px; font-size: 10px; line-height: 10px; text-align: center; overflow:hidden; background-color:#FFF; letter-spacing: 1px;}

#space:hover .perma{overflow:visible; width: 250px; padding-top: 5px; padding-bottom: 5px; height: 9px; -webkit-transition: opacity 0.3s linear; opacity: 0.6; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; transition: all 0.3s linear;}


#pages{font-family: Tahoma; font-size: 9px; line-height: 9px; margin-top: 15px;}

#permapage{font-family: Bakersville; font-size: 10px; margin-bottom: 20px;}

.permalink{float: right; width: auto; font-family: Bakersville; font-size: 9px; line-height: 9px;}

.permalink a{color:{color:Link};}

.links a:hover{text-transform: uppercase;}

.title{font-family: {font:Title}; font-size: {text:Title font size}; line-height: {text:Title line height}; color: {color:Title}; font-weight: bold;}

.blogtitle{font-family:{font:Title}; font-size: 18px; line-height: 18px; letter-spacing: 1px; font-style: italic; margin-bottom: 3px; color:{color:blog title};}

blockquote{padding:0px 0px 2px 3px; margin:0px 0px 2px 1px; border-left: 1px solid {color:Text};}

ul, ol, li{list-style:none; margin:0px; padding:0px;}

</style>

<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
<meta name="viewport" content="width=820" />

{block:ContentSource} <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> {/block:SourceLogo} {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} --> {/block:ContentSource}

</head>

</script>

<body>



<div id="center">

{block:ifShowTwitter}
<div id="twitter">
<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 3,
interval: 30000,
width: 175,
height: 300,
theme: {
shell: {
background: '{color:Twitter Shell Background}',
color: '{color:Twitter Shell Color}'
},
tweets: {
background: '{color:Tweets Background}',
color: '{color:Tweets Color}',
links: '{color:Tweets Links}'
}
},
features: {
scrollbar: false,
loop: false,
live: false,
behavior: 'all'
}
}).render().setUser('{text:twitter username}').start();
</script>
</div>
{/block:ifShowTwitter}

<div id="side">

{block:ifShowTitle}<div class="blogtitle">{Title}</div>{/block:ifShowTitle}

{block:ifShowPhoto}<a title="" href="/"><img src="{image:sidebar}" width=175px></a>{/block:ifShowPhoto} {Description}{block:AskEnabled}
<li><a href="http://lovelessbeat.tumblr.com/ask">Ask Me</a></li>
{/block:AskEnabled}
</div>

<div id="posts">
{block:Posts}
<div id="space">

{block:Text}
{block:Title}<span class="title">{Title}</span>{/block:Title}
<span class="entrytext">{Body}</span>
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
{/block:Text}

{block:Answer}
<div style="background-color:{color:Question Background}; padding: 4px; {block:IndexPage}width: 242px;{/block:IndexPage}{block:PermalinkPage}width: 492px;{/block:PermalinkPage}"><b>{Asker}</b>: {Question}</div>
<div style="">{Answer}</div>
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
{/block:Answer}

{block:Link}
<a href="{URL}" class="title">{Name}</a>
{block:Description}{Description}{/block:Description}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
{block:Link}

{block:Photo}{block:IndexPage}
<div class="perma"><a href="{permalink}">{ShortMonth} {DayofMonth}{DayOfMonthSuffix} {Year} | {NoteCountWithLabel}</a></span></div>
{/block:IndexPage}{block:IndexPage}<a href="{permalink}"><img src="{PhotoURL-400}" alt="{PhotoAlt}" width=250px/></a>{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"width=500px/>{/block:PermalinkPage}
{/block:Photo}

{block:Photoset}
{block:IndexPage}<center><div style="padding-top: 10px; padding-bottom: 10px; background-color:{color:Photoset background};">{Photoset-250}</div></center>{/block:IndexPage}
{block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
{/block:Photoset}

{block:Quote}
{block:Source} <div style="font-family: helvetica neue; font-weight: bold; color:{color:Link};"><a href="{Permalink}">{Source}</a>{/block:Source}</div><div style="margin-top: 5px; background-color:{color:Quote background}; padding: 7px;">{Quote}</div>
{/block:Quote}

{block:Chat}
{block:Title}<span class="title">{Title}</span>{/block:Title}
<ul class="chat">
{block:Lines}
<li class="user_{UserNumber}">
{block:Label}
<span class="label">{Label}</span>
{/block:Label}

{Line}
</li>
{/block:Lines}
</ul>
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
{/block:Chat}

{block:Audio}
{block:IndexPage}
{block:AlbumArt}
<a href="{Permalink}"><img src="{AlbumArtURL}" width=250/></a>
{/block:AlbumArt}
<div style="background-color:#FFF; width: 250px;-webkit-box-shadow: 0px 0px 7px rgba(0,0,0,0.9);-moz-box-shadow: 0px 0px 7px rgba(0,0,0,0.9);box-shadow: 0px 0px 7px rgba(0,0,0,0.7);"><div style="width:250px; height:27px;">{AudioPlayerWhite}</div></div>{/block:IndexPage}

{block:PermalinkPage}
{block:AlbumArt}
<img src="{AlbumArtURL}" width=500/>
{/block:AlbumArt}<div style="background-color:#FFF; width: 500px;-webkit-box-shadow: 0px 0px 1px #CCC;-moz-box-shadow: 0px 0px 1px #CCC;box-shadow: 0px 0px 1px #CCC;"><div style="width:500px; height:27px;">{AudioPlayerWhite}</div></div>{/block:PermalinkPage}

{/block:Audio}

{block:Video}
{block:IndexPage}{Video-250}{Caption}{/block:IndexPage}
{block:PermalinkPage}{Video-500}{/block:PermalinkPage}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
{block:Video}

{block:PermalinkPage}
{block:Date}
<div id="permapage"><div style="float: left; width: auto; font-weight: bold;">Posted on {DayofMonth} {Month}</div>
{/block:Date}

{block:NoteCount}
<div style="float: right; width: auto; font-weight: bold;">{NoteCountWithLabel}</div>
{/block:NoteCount}

{block:Caption}<br>{Caption}{/block:Caption}</div>
{/block:PermalinkPage}

{block:PostNotes}<br><div style="max-height: 175px; overflow: auto;">{PostNotes}</div>{/block:PostNotes}
</div>

{/block:Posts}
<!-- SCM Music Player http://scmplayer.net -->
<script type="text/javascript" src="http://scmplayer.net/script.js"
data-config="{'skin':'skins/aquaPink/skin.css','volume':69,'autoplay':true,'shuffle':true,'repeat':1,'placement':'bottom','showplaylist':false,'playlist':[{'title':'Nina Simone - Feeling Good (Bassnectar Remix)','url':'https://www.youtube.com/watch?v=eHI92uVNF8E'},{'title':'Oh Wonder - Lose It (Jerry Folk Remix)','url':'https://www.youtube.com/watch?v=NhK8Ehv6aPI'},{'title':'Panic! At The Disco: Emperors New Clothes','url':'https://soundcloud.com/panicatthedisco/panic-at-the-disco-emperors-new-clothes'},{'title':'%22Can%27t Kill Us%22 by The Glitch Mob','url':'https://www.youtube.com/watch?v=s5CP72VutKc'},{'title':'Damien Rice- Hypnosis','url':'https://www.youtube.com/watch?v=4TXy2i036LU'},{'title':' Safetysuit - Find a Way','url':'https://www.youtube.com/watch?v=N_aK1QYZkNk'},{'title':'Oh Wonder - Body Gold (Delusion Remix)','url':'https://www.youtube.com/watch?v=2QqTbCGCnIQ'},{'title':'Hozier - Take Me To Church (TEEMID & Jasmine Thompson Edition)','url':'https://www.youtube.com/watch?v=vMTAAOtjFYY'},{'title':'FF - Crave You (TEEMID & Daniela Andrade Cover)','url':'https://www.youtube.com/watch?v=8S6wJU0i_yQ'},{'title':'Felix Jaehn - Shine (ft. Freddy Verano & Linying)','url':'https://www.youtube.com/watch?v=RC4jFX7Qvys'},{'title':'%22On Love%22 by Kahlil Gibran (sung by Lisa Hannigan & Glen Hansard)','url':'https://www.youtube.com/watch?v=dj4WqeJfy9o'},{'title':'Castle by Halsey','url':'https://www.youtube.com/watch?v=1rfSHisyHdc'},{'title':'Little Game - Nightcore','url':'https://www.youtube.com/watch?v=tuJh38D6c4o'},{'title':'Doll House- Nightcore','url':'https://www.youtube.com/watch?v=xkIytYlDD_o'},{'title':'Homewrecker- Marina and the Diamonds','url':'https://www.youtube.com/watch?v=VmOO5Y1wiIA'}]}" ></script>
<!-- SCM Music Player script end -->



</div>
</div>
</div>
</center>
<script type="text/javascript">

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-34180532-1']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script>
<script src='http://code.jquery.com/jquery-1.4.2.min.js' type='text/javascript'></script>
<script src='http://static.tumblr.com/1s4z8hu/UTBlo4136/jquery.masonry.min.js' type='text/javascript'></script>

<center> <center>{block:NextPage}<a href="{NextPage}"><font size="12">Next Page/ </font></a>{/block:NextPage}
{block:PreviousPage} <a href="{PreviousPage}"><font size="12"> /Previous Page</font></a>{/block:PreviousPage}<br>
{block:PermalinkPagination}
{block:NextPost}<a href="{NextPost}"><font size="12">Next Page/ </font></a>{/block:NextPost}
{block:PreviousPost} <a href="{PreviousPost}"><font size="12"> /Previous Page</font></a>{/block:PreviousPost}
{/block:PermalinkPagination}<p>
</center>

</body>
</html>

[pandy]

All the DIVs with the id 'space' are floated left. They have the same width but, naturally, different heights. You could say floats like this fill out one row at the time, one after the other from left to right. When there isn't room for more boxes the next one goes to the leftmost of the next row. All these DIVs are contained in DIV with the id 'center' that's 558px wide, so there are only room for two boxes in a row. The problem is the boxes have different height and will get stuck on each other. That's why you get the gaps. You have to rethink the layout. It cannot be done with floats if you want them in the order you have now.

A serious error is that an ID is supposed to be unique to a page, i.e. you can have exactly one instance of it on the same page. You should use class instead. As you have it no, some browsers may apply the CSS to only the first (or maybe last) instance of the id.