Weird Shifting

Silly me...

wrong URL
http://www.genedco.com/newsite/listings.php

These are lined up ok right now but if i change the listing around i get gaps...

Bizarre

Hi again,

Everything does look lined up now and you mention but that makes it more difficult to determine the issue.

One thing I did notice on the published page is that <div class="row"> on line 325 doesn't have a closing div.

Also, after the 4th listing, you should insert a <br clear="left">
.
Can you try adding both and let me now the results?

Thanks!

ok i removed the first <div class=twelve columns">

doesnt seem to cha nge anything and added the <br clear>  SO THE CODE NOW LOOKS LIKE THIS ...

<div class="row">

<font size="+1"color="#660000"><strong>Our Newest Additions...<hr></strong></font>

<?php foreach ($listingsRecords as $record): ?>
<?php foreach ($record['main_image'] as $index => $upload): ?>
<div class="three columns"><font face="Arial,Helvetica,sans-serif" size="-1">Location: &nbsp;<strong><?php echo $record['content'] ?></strong></font><br/><br>
<a href="<?php echo $record['_link'] ?>"><img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" border="0" /></a><br><br>
<font face="Arial,Helvetica,sans-serif" size="-1"><?php echo $record['property_type:label'] ?><br><strong>$<?php echo htmlencode($record['price']) ?>&nbsp;<?php echo $record['per:label'] ?>&nbsp;<br><?php echo $record['utilities:label'] ?></strong><br><?php echo $record['rental_status:label'] ?>&nbsp;<?php echo $record['occupancy_date:label'] ?>&nbsp;<?php echo $record['occupany_date_day:label'] ?></font><br/><br><br><br clear="left"></div>
<?php $maxCols=4; if (@++$count % $maxCols == 6): ?></div><?php endif; ?>
<?php endforeach ?>
<?php endforeach ?>
<?php if (!$listingsRecords): ?>
<strong>Sorry we have nothing matching your description at this time</strong><br/><br/>
<?php endif ?>

</div>

If you go to 
http://www.genedco.com/newsite/listings45b.php

Do a search with  LOCATION :COBURG     BEDRROMS  2   AND    PARKING ON sITE   CHECKED     you will see the gap i am talking about IN THE RESULTS

AS A followup to my previous reply 10 mins ago...

If you go to
http://www.genedco.com/newsite/listings45b.php

 and do a SEARCH  with just the Parking ON SITE checked you will see the gaps io am talking about in the results.

Again the code is as follows:

<div class="row">

<font size="+1"color="#660000"><strong>Our Newest Additions...<hr></strong></font>

<?php foreach ($listingsRecords as $record): ?>
<?php foreach ($record['main_image'] as $index => $upload): ?>
<div class="three columns"><font face="Arial,Helvetica,sans-serif" size="-1">Location: &nbsp;<strong><?php echo $record['content'] ?></strong></font><br/><br>
<a href="<?php echo $record['_link'] ?>"><img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" border="0" /></a><br><br>
<font face="Arial,Helvetica,sans-serif" size="-1"><?php echo $record['property_type:label'] ?><br><strong>$<?php echo htmlencode($record['price']) ?>&nbsp;<?php echo $record['per:label'] ?>&nbsp;<br><?php echo $record['utilities:label'] ?></strong><br><?php echo $record['rental_status:label'] ?>&nbsp;<?php echo $record['occupancy_date:label'] ?>&nbsp;<?php echo $record['occupany_date_day:label'] ?></font><br/><br><br><br clear="left"></div>
<?php $maxCols=4; if (@++$count % $maxCols == 6): ?></div><?php endif; ?>
<?php endforeach ?>
<?php endforeach ?>
<?php if (!$listingsRecords): ?>
<strong>Sorry we have nothing matching your description at this time</strong><br/><br/>
<?php endif ?>

</div>

The issue is that the last item in the row is shorter in height that the previous... so floating comes in under it rather than clearing.

If you add a class to like <div class="three columns fixed"> then add to your css file:   .fixed{ height:200px;}  or something similar, you will force all those items to be the same height, and then it will lay out properly.

The issue is going to when your screen goes smaller - your media queries will have to be adjusted to it looks right on mobile etc.