...

View Full Version : Space between tables



sackstein
05-04-2009, 07:18 PM
Hello,

I am working on trying to get this grid to have no spaces between the images however I just cannot seem to get rid of the space at the bottom of each image.

This is the page in question: http://www.anzie.com/test5.php

here is the code:


<?php
require('includes/application_top.php');

require(DIR_WS_LANGUAGES . $language . '/' . FILENAME_PRODUCTS_NEW);

$breadcrumb->add(NAVBAR_TITLE, tep_href_link(FILENAME_PRODUCTS_NEW));

$osCsid=tep_session_id();
$filename=$_SERVER['PHP_SELF'];
$len=strrpos($filename,".")-strrpos($filename,"/")-1;
$filename=substr($filename,strrpos($filename,"/")+1,$len);
//echo $filename;
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html <?php echo HTML_PARAMS; ?>>
<head>

<script type="text/javascript" src="/js/mootools.svn.js"></script>
<script type="text/javascript" src="/js/demo.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="stylestip.css" />

<script type="text/javascript">
window.addEvent('domready', function(){
/* Tips 1 */
var Tips1 = new Tips($$('.Tips1'));

});
</script>

<meta http-equiv="Content-Type" content="text/html; charset=<?php echo CHARSET; ?>">
<title><?php echo TITLE; ?></title>
<base href="<?php echo (($request_type == 'SSL') ? HTTPS_SERVER : HTTP_SERVER) . DIR_WS_CATALOG; ?>">
<link rel="stylesheet" type="text/css" href="stylesheettest.css">
</head>
<body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0">
<!-- header //-->
<?php require(DIR_WS_INCLUDES . 'header_collectionstest.php'); ?>
<!-- header_eof //-->

<!-- body //-->
<?php

$products_new_array = array();

$products_new_query_raw = "select p.products_id, pd.products_name, p.products_quantity, p.products_image, p.products_price, p.products_date_added, p.products_last_modified, p.products_date_available, p.products_status from products p, products_description pd, products_to_categories p2c where p.products_id = pd.products_id and pd.language_id = '1' and p.products_id = p2c.products_id and p2c.categories_id in(30,31,32,33,34,35,36,37,38,44,43) order by pd.products_name";
//echo $products_new_query_raw;
//echo $products_new_query_raw;
$products_new_split = new splitPageResults($products_new_query_raw, 25);

if (($products_new_split->number_of_rows > 0) && ((PREV_NEXT_BAR_LOCATION == '1') || (PREV_NEXT_BAR_LOCATION == '3'))) {
?>

<tr>
<td><table border="0" width="797" cellspacing="0" cellpadding="2">
<tr>
<td class="smallText">&nbsp;</td>
<td align="right" class="smallText">&nbsp;</td>
</tr>
</table></td>
</tr>
<?php
}
?>
<tr>
<td>
<?
if ($products_new_split->number_of_rows > 0)
{
?>
<table border="0" width="797" cellspacing="0" cellpadding="0">
<tr>
<td width="30">&nbsp;</td>
<td align="left" class="smallText"><?php echo $products_new_split->display_links(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))); ?><a href="viewall.php?osCsid=<?php echo $osCsid?>" ><strong> View All</strong></a>
</tr>
</table>
<table width="797" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><table border=0 cellpadding="0" cellspacing="0" align="left">
<tr>
<?
if($products_new_split->current_page_number == 1)
{
?>

<?
}
else
{
if($filename=='product_default')
{
?>

<?
}
else
{
?>

<?
}
}
?>
<?
}
?>
<?php
$i=0;
if ($products_new_split->number_of_rows > 0) {
$products_new_query = tep_db_query($products_new_split->sql_query);
while ($products_new = tep_db_fetch_array($products_new_query)) {
if ($new_price = tep_get_products_special_price($products_new['products_id'])) {
$products_price = '<s>' . $currencies->display_price($products_new['products_price'], tep_get_tax_rate($products_new['products_tax_class_id'])) . '</s> <span class="productSpecialPrice">' . $currencies->display_price($new_price, tep_get_tax_rate($products_new['products_tax_class_id'])) . '</span>';
} else {
$products_price = $currencies->display_price($products_new['products_price'], tep_get_tax_rate($products_new['products_tax_class_id']));
}
?>
<?php if ($i==5)
{ ?>
</tr>
<tr>

<?php
$i=1; }
else
{ $i++; }

?>
<td valign="top"><table border="0" cellpadding="0" cellspacing="0" width="159px">
<tr>
<td align="center"><?php echo '<table border="0" bordercolor="#E8E8E8" cellspacing="0" cellpadding="0" ><tr><td height="210" align="center" width="159"><a class="Tips1" title="Product Info ::'.$products_new['products_name'].' <br /><br /> $'.$products_new['products_price'].'" href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $products_new['products_id']) . ' " >' . tep_image(DIR_WS_IMAGES . $products_new['products_image'], $products_new['products_name'], 159, 210 ) . ' </a></td></tr></table>'; ?></td>
</tr>
</table></td>
<?php }
?>
<?

if($products_new_split->number_of_pages==$products_new_split->current_page_number)
{
?>
<?
}
else
{
if($filename=='product_default')
{
?>

<?
}
else
{
?>
<?
}
}
?>
</tr>
</table>
</td>
</tr>
<?
} else {
?>


<?php
}
?>
</table>
<table border="0" width="797" cellspacing="0" cellpadding="0">
<tr>

<td align="left" class="smallText"><?php echo $products_new_split->display_links(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))); ?><a href="viewall.php?osCsid=<?php echo $osCsid?>" ><strong> View All</strong></a>
</tr>
</table></td>
</tr>
<?php
if (($products_new_split->number_of_rows > 0) && ((PREV_NEXT_BAR_LOCATION == '2') || (PREV_NEXT_BAR_LOCATION == '3'))) {
?>

<?php
}
?>
</table></td>
<!-- body_text_eof //-->
<td width="<?php //echo BOX_WIDTH; ?>" valign="top"><table border="0" width="<?php //echo BOX_WIDTH; ?>" cellspacing="0" cellpadding="2">
<!-- right_navigation //-->
<?php //require(DIR_WS_INCLUDES . 'column_right.php'); ?>
<!-- right_navigation_eof //-->

</table></td>
</tr>

</table>
</TBODY></TABLE>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-2976036-1");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html>



Ive been trying all day and simply cannot find a way to get rid of it!

*note this page will not load in IE yet due to a problem I am having with mootools

SB65
05-04-2009, 07:47 PM
No gap in Chrome, but I can see one in Firefox.

Try adding


img {display:block}

to your css.

sackstein
05-04-2009, 08:16 PM
Seems to have just added spaced between the images now.

adios
05-04-2009, 10:42 PM
Actually, looks OK from here. You have an huge amount of whitespace in your HTML formatting; this isn't supposed to show up in the document, but don't count on it. If you're still having the problem, try eliminating all the tabs, spaces, some of the carriage returns etc. Almost always helps.

SB65
05-05-2009, 10:04 AM
OK, well, adding


img {display:block}

to the css definitely removes a gap underneath the image for me in Firefox 3. You also have in your html a lot of occurrences of:


<td align="center" style="display:block;">

Take the display:block off these elements and give it another try. This works for me in FF3 - maybe you're getting a different effect in another browser?

abduraooft
05-05-2009, 10:16 AM
You might need to add

td img {
float:left;
} into your CSS to remove all those mysterious gaps (https://developer.mozilla.org/en/images,_tables,_and_mysterious_gaps)!

sackstein
05-05-2009, 09:25 PM
Thank you!

Using float left seemed to do the trick in combination with changing the height and width of the td to be smaller.

I don't know how some of you were seeing it as being ok in firefox 3 though? I was using firefox 3 and saw the spaces so hopefully it still looks good for you. Ill cross my fingers..



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum