Photo grid not styling right with wookmark and php

[Glenskie]

Hi I am trying to create a grid like gallery and for some reason it does not look right? I want it to look like pinterest so I am trying to use wookmark jquery. Here is my code and an image to view. Thank you.

Here is the css:

#gallerycontainer {

display: inline-block;

background-color: #f0f0f0;

padding: 0px;

width:850px;

/*border: 1px solid #DBDBDB;

-webkit-box-shadow: #E4E4E4 0px 0px 5px;

-moz-box-shadow: #E4E4E4 0px 0px 5px;

box-shadow:#E4E4E4 0px 0px 5px;*/

position:relative;

left:0px;

bottom:13px;

overflow:inherit;

top:0px;

float: left;

padding-right: 0px;

margin-left: 10px;

overflow: auto;

}


#gallery{


}


#gallery li img {

float: left;


border: 5px solid #fff;


-webkit-transition: box-shadow 0.5s ease;

-moz-transition: box-shadow 0.5s ease;

-o-transition: box-shadow 0.5s ease;

-ms-transition: box-shadow 0.5s ease;

transition: box-shadow 0.5s ease;

max-width:250px;

max-height:200px;

padding:0px;


}

.galleryinfo{

border: 2px solid #fff;

padding-bottom: 40px;

float: left;

margin:9px;

background: white;


}

#gallery li img:hover {

-webkit-box-shadow: 0px 0px 7px rgba(255,255,255,0.9);

box-shadow: 0px 0px 7px rgba(255,255,255,0.9);

cursor: pointer;

}

.myaccounttitle{

text-align: center;

}

And here is the php and html.

<script type="text/javascript" src="js/jquery.wookmark.js"></script>

<script type="text/javascript">$('#gallery li').wookmark();</script>

<div class="myaccounttitle">My Images</div>

<div id="gallery">

<?php 


function pictures($query)

{

while($row = mysql_fetch_array($query))

{

$id = $row['id'];

$title = $row['title'];

$author = $row['userid'];

$date = date("F j, Y, g:i a", $row['date']);

$picture = $row['picture'];

// $likes = $row['likes'];

// $favs = $row['favs'];

$unique = mysql_num_rows(mysql_query("SELECT * FROM views WHERE picture='$id' GROUP BY ip"));

?>

<div class="galleryinfo">

<li id="<?php print $id?>">

<a class="fancybox" rel="group" href="photos/<?php print $picture?>"><img src="photos/<?php print $picture?>"/></a>

</li>

Views : <?php print($unique) ?>

</div>

<?php

}}}

?>


<div id="gallerycontainer">

<?php

if($account == "c") {

pictures($query2);

}else {

pictures($query);

}

?> 

</div>

All of your help is greatly appreciated.