|
HTML - Extra Spacing Around And Within Nested Table
Hi guys & girls,
I've got a table nested within a table row. There's a small gap I can't close at the top of the table (see image, attached). Within the table I have cell padding, but it's much more dramatic than I want at the top and bottom. Is there any way to fix these problems with HTML and inline CSS (it's going to be an HTML e-mail). This is for a client and due tomorrow, so any help would be awesome. Thank you. HTML Code: <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" style="line-height:16px;">
<table width="600" border="0" bordercolor="#000000" cellspacing="0" cellpadding="0" style="border-top:1px solid #000000; border-left:1px solid #000000; border-right:1px solid #000000; border-bottom:1px solid #000000;">
<tr>
<td><img src="images/ACP9040057_email_ClinicalPsychologist_01.jpg" width="600" height="88" alt="For What Matters Most"></td>
</tr>
<tr>
<td><table width="600" border="0" cellspacing="0" cellpadding="0" style="padding:0; border:0">
<tr>
<td align="center" valign="top"><table width="570" border="0" cellspacing="0" cellpadding="5">
<tr>
<td width="359" align="left" valign="top"><p><font face="Arial, Helvetica, sans-serif" style="font-size:12px; text-align:left;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris congue porta tincidunt. Nullam et turpis lorem, sagittis adipiscing nunc. In orci orci, iaculis et sollicitudin ac, adipiscing vel magna. Nullam et orci in dui tristique ultricies. Donec ligula turpis, blandit eget egestas sed, semper eu elit. Nulla in dolor sapien. Suspendisse id nisi porttitor purus ullamcorper dictum. Mauris posuere libero massa.</font></p></td>
<td width="171" align="center" valign="middle"><table width="140" border="0" cellspacing="0" cellpadding="15">
<tr>
<td align="left" bgcolor="#b1c1c9"><font face="Arial, Helvetica, sans-serif" style="font-size:12px; font-weight:bold; line-height:16px; text-align:left;">Qualifications:</font><br />
<font face="Arial, Helvetica, sans-serif" style="font-size:12px; font-weight:normal; text-align:left;">To qualify you must be a U.S. citizen age 18–39 and enrolled in the United States or Puerto Rico.</font></td>
</tr>
</table></td>
</tr>
<tr>
<td align="left" valign="top"><font face="Arial, Helvetica, sans-serif" style="font-size:12px; font-weight:normal; text-align:left;">Give yourself the opportunity to concentrate on your education instead of the worries of accumulating debt. <a href="#">Click here</a> now to find out more.</font></td>
<td align="center" valign="top"><a href="#"><img src="images/go_button.jpg" width="171" height="60" alt="Go Button" border="0"></a></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
<tr><td><img src="images/ACP9040057_email_ClinicalPsychologist_05.jpg" width="600" height="9" alt=""></td></tr>
<tr><td align="center" valign="top" style="padding:0;"><table width="570" border="0" vspace="0" align="center" cellpadding="10" cellspacing="0" style="line-height:10px; text-align:left; display:block; border-collapse: collapse;">
<tr><td align="left" valign="top"><p><font face="Arial, Helvetica, sans-serif" style="font-size:10px; line-height:10px; text-align:left;">If you no longer wish to receive email communication from the U.S. Air Force, please click <a href="#" target="_blank">here</a>.
<font face="Arial, Helvetica, sans-serif" style="font-size:10px; line-height:10px; text-align:left;">Your address will be removed from this email list.</font><br /><br />
Or send a request to:<br />
ddd<br />
ddd<br />
ddd</font></p></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
Similar TutorialsHere is an image depicting the trouble I'm having: I want to make a table, consisting of many cells. These cells would be fixed, and *very different* in sizes. It's easy to make a no-space table when all the images are exactly the same size, but when you have images with a variety of sizes, the table doesn't fit perfectly. Basically I want to create a collage of images with overlay text on each image. My idea was that I could create a table, and each cell (td) would have a background which is the image. Then I could just type in that cell, so the text would be over the image. Then I'd do this for every one of my images, and a collage would be formed. The problem is, the table makes large white spaces wherever the image sizes don't match! How do I get rid of these spaces, or is there an entirely different code/approach I should be using? Thanks! Here is my current code: HTML Code:
<html>
<head>
<style type="text/css">
table.nospace {
padding: 0; margin: 0;
border-collapse: collapse;
}
table.nospace tr {
padding: 0; margin: 0;
}
table.nospace td {
padding: 0; margin: 0;
}
</style>
</head>
<body>
<TABLE class="nospace" width="2040px" height="2000px" cellspacing="0px" cellpadding="0px">
<TR>
<td valign="top">
<table><tr>
<TD WIDTH="800px" HEIGHT="800px" BACKGROUND="image.jpg" VALIGN="bottom">
<h1><FONT COLOR=#ffffff>text</FONT></h1>
</TD></tr></table>
</td>
<td valign="top">
<table><tr>
<TD WIDTH="700" HEIGHT="497" BACKGROUND="image" VALIGN="bottom">
<h1><FONT COLOR=#ffffff>Text</FONT></h1>
</TD></tr></table>
</td>
<td valign="top">
<table><tr>
<TD WIDTH="700" HEIGHT="467" BACKGROUND="image.jpg" VALIGN="bottom">
<h1><FONT COLOR=#ffffff>Text</FONT></h1>
</TD></tr></table>
</td>
</TR>
</TABLE>
</body>
</html>
Hey guys. I hope I can get some help. I posted in another forum asking this question and got "clobbered". I am having issues with a site that uses tables to put together php files. The files, as per the norm are header.php, footer.php,clumn_left.php, the index page and footer.php. These are put together using an html table. Normally when I put these together it looks great. But i am having troubles with the wishlist.php when it replaces the index.php. And of course I want to make the change in the wishlist.php instead of the others. The files are posted below but I can give you a link offline so you can see what Im trying to say. Thanks. header.php Code: <?php
/*
$Id: header.php,v 1.42 2003/06/10 18:20:38 hpdl Exp $
osCommerce, Open Source E-Commerce Solutions
http://www.oscommerce.com
Copyright (c) 2003 osCommerce
Released under the GNU General Public License
*/
// check if the 'install' directory exists, and warn of its existence
if (WARN_INSTALL_EXISTENCE == 'true') {
if (file_exists(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/install')) {
$messageStack->add('header', WARNING_INSTALL_DIRECTORY_EXISTS, 'warning');
}
}
// check if the configure.php file is writeable
if (WARN_CONFIG_WRITEABLE == 'true') {
if ( (file_exists(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/includes/configure.php')) && (is_writeable(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/includes/configure.php')) ) {
$messageStack->add('header', WARNING_CONFIG_FILE_WRITEABLE, 'warning');
}
}
// check if the session folder is writeable
if (WARN_SESSION_DIRECTORY_NOT_WRITEABLE == 'true') {
if (STORE_SESSIONS == '') {
if (!is_dir(tep_session_save_path())) {
$messageStack->add('header', WARNING_SESSION_DIRECTORY_NON_EXISTENT, 'warning');
} elseif (!is_writeable(tep_session_save_path())) {
$messageStack->add('header', WARNING_SESSION_DIRECTORY_NOT_WRITEABLE, 'warning');
}
}
}
// check session.auto_start is disabled
if ( (function_exists('ini_get')) && (WARN_SESSION_AUTO_START == 'true') ) {
if (ini_get('session.auto_start') == '1') {
$messageStack->add('header', WARNING_SESSION_AUTO_START, 'warning');
}
}
if ( (WARN_DOWNLOAD_DIRECTORY_NOT_READABLE == 'true') && (DOWNLOAD_ENABLED == 'true') ) {
if (!is_dir(DIR_FS_DOWNLOAD)) {
$messageStack->add('header', WARNING_DOWNLOAD_DIRECTORY_NON_EXISTENT, 'warning');
}
}
if ($messageStack->size('header') > 0) {
echo $messageStack->output('header');
}
?>
<table width="100%" style="height:100%; background:#252525;" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="6" height="100%" valign="top"><?=tep_image(DIR_WS_IMAGES.'bg1.gif','','','','style="margin-top:72px"')?></td>
<td width="100%" height="100%" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="100%" height="800" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="100%" height="11" valign="top"></td>
</tr>
<tr>
<td width="100%" height="55" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="25%" height="100%" valign="top">
<table class="black m1_l" width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="m1_r h_text" width="100%" height="100%" valign="top" style="padding-left:15px;">
<?php echo tep_draw_separator('spacer.gif', '1', '8'); ?><br>
<?=BOX_HEADING_CURRENCIES?>:<br>
<?php echo tep_draw_separator('spacer.gif', '1', '5'); ?><br>
<?
echo tep_draw_form('currencies', tep_href_link(basename($PHP_SELF), '', $request_type, false), 'get');
reset($currencies->currencies);
$currencies_array = array();
while (list($key, $value) = each($currencies->currencies)) {
$currencies_array[] = array('id' => $key, 'text' => $value['title']);
}
$hidden_get_variables = '';
reset($HTTP_GET_VARS);
while (list($key, $value) = each($HTTP_GET_VARS)) {
if ( ($key != 'currency') && ($key != tep_session_name()) && ($key != 'x') && ($key != 'y') ) {
$hidden_get_variables .= tep_draw_hidden_field($key, $value);
}
}
echo tep_draw_pull_down_menu('currency', $currencies_array, $currency, 'onChange="this.form.submit();" class="select"') . $hidden_get_variables . tep_hide_session_id();
echo '</form>';
?>
<br>
</td>
</tr>
</table>
</td>
<td width="7" height="100%" valign="top"><?php echo tep_draw_separator('spacer.gif', '7', '1'); ?></td>
<td width="25%" height="100%" valign="top">
<table class="black m1_l" width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="m1_r h_text" width="100%" height="100%" valign="top" style="padding-left:15px;">
<?php echo tep_draw_separator('spacer.gif', '1', '8'); ?><br>
<?=BOX_HEADING_LANGUAGES?>:<br>
<?php echo tep_draw_separator('spacer.gif', '1', '5'); ?><br>
<?
if (!isset($lng) || (isset($lng) && !is_object($lng))) {
include(DIR_WS_CLASSES . 'language.php');
$lng = new language;
}
$languages_string = '';
reset($lng->catalog_languages);
$rr=0;
while (list($key, $value) = each($lng->catalog_languages)) {
if ($rr!=0) $languages_string .=tep_draw_separator('spacer.gif', '10', '1');
$languages_string .= '<a href="' . tep_href_link(basename($PHP_SELF), tep_get_all_get_params(array('language', 'currency')) . 'language=' . $key, $request_type) . '">' . tep_image(DIR_WS_LANGUAGES . $value['directory'] . '/images/' . $value['image'], $value['name']) . '</a>';
$rr++;
}
echo $languages_string;
?>
<br>
</td>
</tr>
</table>
</td>
<td width="6" height="100%" valign="top"><?php echo tep_draw_separator('spacer.gif', '6', '1'); ?></td>
<td width="25%" height="100%" valign="top">
<table class="black m1_l" width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="m1_r h_text" width="100%" height="100%" valign="top" style="padding-left:15px;">
<br style="line-height:10px;">
<a href="<?php echo tep_href_link('wishlist.php')?>"><?php echo BOX_HEADING_CUSTOMER_WISHLIST; ?></a>
</td>
</tr>
</table>
</td>
<td width="6" height="100%" valign="top"><?php echo tep_draw_separator('spacer.gif', '6', '1'); ?></td>
<td width="25%" height="100%" valign="top">
<table class="black m1_l" width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="m1_r cart_text" width="100%" height="100%" valign="top" style="padding-left:43px;">
<br style="line-height:10px;">
<font><?=BOX_HEADING_SHOPPING_CART?>:</font><br>
<br style="line-height:8px;">
now in your cart <a href="<?=tep_href_link('shopping_cart.php')?>"><strong><?=$cart->count_contents()?> <?=BOX_SHOPPING_CART_EMPTY?></strong></a><br>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="100%" height="6" valign="top"></td>
</tr>
<tr>
<td width="100%" height="210" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="189" height="100%" valign="top">
<?=tep_image(DIR_WS_IMAGES.'logo.jpg')?><br>
</td>
<td width="100%" height="100%" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="100%" height="53" valign="top" style="text-align:center">
<a href="<?=tep_href_link('index.php')?>"><?=tep_image_button('l1.jpg')?></a><a href="<?=tep_href_link('products_new.php')?>"><?=tep_image_button('l2.jpg')?></a><a href="<?=tep_href_link('specials.php')?>"><?=tep_image_button('l3.jpg')?></a><a href="<?=tep_href_link('account.php')?>"><?=tep_image_button('l4.jpg')?></a><a href="<?=tep_href_link('contact_us.php')?>"><?=tep_image_button('l5.jpg')?></a><br>
</td>
</tr>
<tr>
<td width="100%" height="157" valign="top" style=" background:url(images/t-dr.gif) repeat-x;">
<table width="100%" style="height:100%; background:url(images/t-l.jpg) no-repeat left;" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="100%" height="100%" valign="top" style="background:url(images/t-r.jpg) no-repeat right;">
<div align="right" style="margin: 16px 66px 0px 0px;">
<?=tep_image(DIR_WS_IMAGES.'slogan.jpg')?><br>
<br style="line-height:8px;">
<a href="<?=tep_href_link('specials.php')?>"><?=tep_image(DIR_WS_IMAGES.'click.gif')?></a>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="100%" height="5" valign="top"></td>
</tr>
Hey guys. I hope I can get some help. I posted in another forum asking this question and got "clobbered". I am having issues with a site that uses tables to put together php files. The files, as per the norm are header.php, footer.php,clumn_left.php, the index page and footer.php. These are put together using an html table. Normally when I put these together it looks great. But i am having troubles with the wishlist.php when it replaces the index.php. And of course I want to make the change in the wishlist.php instead of the others. The files are posted below but I can give you a link offline so you can see what Im trying to say. Thanks. (and Im not sure why but my thread didnt show up in the forum the first time but it did in my subscription, so sorry if it ends up being a double post.) header.php Code: <?php
/*
$Id: header.php,v 1.42 2003/06/10 18:20:38 hpdl Exp $
osCommerce, Open Source E-Commerce Solutions
http://www.oscommerce.com
Copyright (c) 2003 osCommerce
Released under the GNU General Public License
*/
// check if the 'install' directory exists, and warn of its existence
if (WARN_INSTALL_EXISTENCE == 'true') {
if (file_exists(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/install')) {
$messageStack->add('header', WARNING_INSTALL_DIRECTORY_EXISTS, 'warning');
}
}
// check if the configure.php file is writeable
if (WARN_CONFIG_WRITEABLE == 'true') {
if ( (file_exists(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/includes/configure.php')) && (is_writeable(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/includes/configure.php')) ) {
$messageStack->add('header', WARNING_CONFIG_FILE_WRITEABLE, 'warning');
}
}
// check if the session folder is writeable
if (WARN_SESSION_DIRECTORY_NOT_WRITEABLE == 'true') {
if (STORE_SESSIONS == '') {
if (!is_dir(tep_session_save_path())) {
$messageStack->add('header', WARNING_SESSION_DIRECTORY_NON_EXISTENT, 'warning');
} elseif (!is_writeable(tep_session_save_path())) {
$messageStack->add('header', WARNING_SESSION_DIRECTORY_NOT_WRITEABLE, 'warning');
}
}
}
// check session.auto_start is disabled
if ( (function_exists('ini_get')) && (WARN_SESSION_AUTO_START == 'true') ) {
if (ini_get('session.auto_start') == '1') {
$messageStack->add('header', WARNING_SESSION_AUTO_START, 'warning');
}
}
if ( (WARN_DOWNLOAD_DIRECTORY_NOT_READABLE == 'true') && (DOWNLOAD_ENABLED == 'true') ) {
if (!is_dir(DIR_FS_DOWNLOAD)) {
$messageStack->add('header', WARNING_DOWNLOAD_DIRECTORY_NON_EXISTENT, 'warning');
}
}
if ($messageStack->size('header') > 0) {
echo $messageStack->output('header');
}
?>
<table width="100%" style="height:100%; background:#252525;" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="6" height="100%" valign="top"><?=tep_image(DIR_WS_IMAGES.'bg1.gif','','','','style="margin-top:72px"')?></td>
<td width="100%" height="100%" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="100%" height="800" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="100%" height="11" valign="top"></td>
</tr>
<tr>
<td width="100%" height="55" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="25%" height="100%" valign="top">
<table class="black m1_l" width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="m1_r h_text" width="100%" height="100%" valign="top" style="padding-left:15px;">
<?php echo tep_draw_separator('spacer.gif', '1', '8'); ?><br>
<?=BOX_HEADING_CURRENCIES?>:<br>
<?php echo tep_draw_separator('spacer.gif', '1', '5'); ?><br>
<?
echo tep_draw_form('currencies', tep_href_link(basename($PHP_SELF), '', $request_type, false), 'get');
reset($currencies->currencies);
$currencies_array = array();
while (list($key, $value) = each($currencies->currencies)) {
$currencies_array[] = array('id' => $key, 'text' => $value['title']);
}
$hidden_get_variables = '';
reset($HTTP_GET_VARS);
while (list($key, $value) = each($HTTP_GET_VARS)) {
if ( ($key != 'currency') && ($key != tep_session_name()) && ($key != 'x') && ($key != 'y') ) {
$hidden_get_variables .= tep_draw_hidden_field($key, $value);
}
}
echo tep_draw_pull_down_menu('currency', $currencies_array, $currency, 'onChange="this.form.submit();" class="select"') . $hidden_get_variables . tep_hide_session_id();
echo '</form>';
?>
<br>
</td>
</tr>
</table>
</td>
<td width="7" height="100%" valign="top"><?php echo tep_draw_separator('spacer.gif', '7', '1'); ?></td>
<td width="25%" height="100%" valign="top">
<table class="black m1_l" width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="m1_r h_text" width="100%" height="100%" valign="top" style="padding-left:15px;">
<?php echo tep_draw_separator('spacer.gif', '1', '8'); ?><br>
<?=BOX_HEADING_LANGUAGES?>:<br>
<?php echo tep_draw_separator('spacer.gif', '1', '5'); ?><br>
<?
if (!isset($lng) || (isset($lng) && !is_object($lng))) {
include(DIR_WS_CLASSES . 'language.php');
$lng = new language;
}
$languages_string = '';
reset($lng->catalog_languages);
$rr=0;
while (list($key, $value) = each($lng->catalog_languages)) {
if ($rr!=0) $languages_string .=tep_draw_separator('spacer.gif', '10', '1');
$languages_string .= '<a href="' . tep_href_link(basename($PHP_SELF), tep_get_all_get_params(array('language', 'currency')) . 'language=' . $key, $request_type) . '">' . tep_image(DIR_WS_LANGUAGES . $value['directory'] . '/images/' . $value['image'], $value['name']) . '</a>';
$rr++;
}
echo $languages_string;
?>
<br>
</td>
</tr>
</table>
</td>
<td width="6" height="100%" valign="top"><?php echo tep_draw_separator('spacer.gif', '6', '1'); ?></td>
<td width="25%" height="100%" valign="top">
<table class="black m1_l" width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="m1_r h_text" width="100%" height="100%" valign="top" style="padding-left:15px;">
<br style="line-height:10px;">
<a href="<?php echo tep_href_link('wishlist.php')?>"><?php echo BOX_HEADING_CUSTOMER_WISHLIST; ?></a>
</td>
</tr>
</table>
</td>
<td width="6" height="100%" valign="top"><?php echo tep_draw_separator('spacer.gif', '6', '1'); ?></td>
<td width="25%" height="100%" valign="top">
<table class="black m1_l" width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="m1_r cart_text" width="100%" height="100%" valign="top" style="padding-left:43px;">
<br style="line-height:10px;">
<font><?=BOX_HEADING_SHOPPING_CART?>:</font><br>
<br style="line-height:8px;">
now in your cart <a href="<?=tep_href_link('shopping_cart.php')?>"><strong><?=$cart->count_contents()?> <?=BOX_SHOPPING_CART_EMPTY?></strong></a><br>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="100%" height="6" valign="top"></td>
</tr>
<tr>
<td width="100%" height="210" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="189" height="100%" valign="top">
<?=tep_image(DIR_WS_IMAGES.'logo.jpg')?><br>
</td>
<td width="100%" height="100%" valign="top">
<table width="100%" style="height:100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="100%" height="53" valign="top" style="text-align:center">
<a href="<?=tep_href_link('index.php')?>"><?=tep_image_button('l1.jpg')?></a><a href="<?=tep_href_link('products_new.php')?>"><?=tep_image_button('l2.jpg')?></a><a href="<?=tep_href_link('specials.php')?>"><?=tep_image_button('l3.jpg')?></a><a href="<?=tep_href_link('account.php')?>"><?=tep_image_button('l4.jpg')?></a><a href="<?=tep_href_link('contact_us.php')?>"><?=tep_image_button('l5.jpg')?></a><br>
</td>
</tr>
<tr>
<td width="100%" height="157" valign="top" style=" background:url(images/t-dr.gif) repeat-x;">
<table width="100%" style="height:100%; background:url(images/t-l.jpg) no-repeat left;" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="100%" height="100%" valign="top" style="background:url(images/t-r.jpg) no-repeat right;">
<div align="right" style="margin: 16px 66px 0px 0px;">
<?=tep_image(DIR_WS_IMAGES.'slogan.jpg')?><br>
<br style="line-height:8px;">
<a href="<?=tep_href_link('specials.php')?>"><?=tep_image(DIR_WS_IMAGES.'click.gif')?></a>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="100%" height="5" valign="top"></td>
</tr>
Also my files have to much code for me to post here s if someone wants me to email them or post them somewhere else please let me know. I'm using the following code to display a table with three columns. The first and third column each have a background image, so that these graphics will appear behind any text. The middle column does not have a background image. Instead, it has three images stacked on top of each other, whose combined height equal the height of the background images on the left and right (30+83+81=194). The table and three cells are given the same dimensions as their contents or background images. Code: <table border="0" cellpadding="0" cellspacing="0" width="584" height="194"> <tr> <td width="239" height="194" align="left" valign="middle" background="left.png"> START </td> <td width="117" height="194"> <img width="117" height="30" src="middle-top.png" border="0" /><br /> <img width="117" height="83" src="middle-middle.png" border="0" /><br /> <img width="117" height="81" src="middle-bottom.png" border="0" /> </td> <td width="228" height="194" align="right" valign="middle" background="right.png"> END </td> </tr> </table> In IE8 this seems to work fine, as it does in Firefox and Chrome. However, in IE7, I get this: You can see that the background begins to repeat at the bottom of the left and right columns, indicating that the table is higher than the dimension specified. Why is this? How can I fix it (without ruining the display in other browsers/versions)? Any suggestions much appreciated! Hello, I've been trying to fix this table problem for hours... I must be missing something simple. I have a table with a bunch of images - the logo and top navigation. For some reason, each column is adding in extra pixels. I've defined the height of each image, and tried dozens of things with column height & stylesheets to get this stuff to align properly, with no luck. When I inspect the element in chrome, I see that the table & columns within have a greater height than the images within. Can anyone provide me with a bit of guidance? Here's the table code: HTML Code: <table id="mast" class="mast" width="770" cellpadding="0" cellspacing="0" border="0"> <tr> <td rowspan="2" height="88"><img src="images/Mast_Smile.png" width="182" height="88" alt="" /></td> <td colspan="9" height="52"><img src="images/Mast_Top.png" width="588" height="52" alt="" /></td> </tr> <tr> <td height="36"><img src="images/Mast_Button_Book.png" width="88" height="36" alt="The Book!" /></td> <td height="36"><img src="images/Mast_Space_1.png" width="24" height="36" alt="" /></td> <td height="36"><img src="images/Mast_Button_Who.png" width="57" height="36" alt="Who?" /></td> <td height="36"><img src="images/Mast_Space_2.png" width="16" height="36" alt="" /></td> <td height="36"><img src="images/Mast_Button_Media.png" width="102" height="36" alt="ATTN: Media" /></td> <td height="36"><img src="images/Mast_Space_3.png" width="28" height="36" alt="" /></td> <td height="36"><img src="images/Mast_Button_Purchase.png" width="112" height="36" alt="For Purchase" /></td> <td height="36"><img src="images/Mast_Space_4.png" width="21" height="36" alt="" /></td> <td height="36"><img src="images/Mast_Cart.png" width="140" height="36" alt="" /></td> </tr> <tr> <td colspan="10" height="6"><img src="images/Mast_Bottom.png" width="770" height="6" alt="" /></td> </tr> </table> You can see it on my server he http://mmm-hmm.com/_test/index.php Thanks so much for any help! Denis For some reason, I have a lot of extra space at the top of my page. What could be causing this and how do I fix it? Okay so me and a friend are making a website for a highschool FBLA contest, and we are having an error with our template... so here is what it is in a nut shell this is what we want it to look like no spaces on the top or bottoms of the TVs THIS is what it looks like on the web, a big ole fat spacing in the table above and below the TVs that we do not want... we have tried a lot of things and can't figure it out...any suggestions? -thanks Legend Problem fixed hi guys... here's a layout i'm working on and i just can't seem to be able to get rid of the spacing on the bottom of the cells where i have a link with my rollover images... here's the url: http://geocities.com/antigatez/school/index.html any help would be appreciated... there is a problem can go through the URL below and open it in IE and any other browser like mozilla or chrome etc the mid section is not working properly it seems in IE as more spaced while in mozilla etc seems less spaced how to solve this issue. www.ims-sc.org please fix the peoblem. I've tried and tried and can't figure this one out, probably VERY easy for others. I've got a table with images and I can't figure out how to remove the spacing betwen the table rows. Here is a link http://www.4wheelcustoms.com/new%20template/index.html Notice both sides of the navagation images have horizontal spacing around them. Any help is appreciated. Hi, I have a fine gray line around the logo. This is not the border of the table it’s the gray bgcolor. I and other HTMLers try to find the reason of this bug but failed. Can you help? You see the style.css and try to find the reason (please do not give vague answers, please look in the code and in the css) tnx Can anyone tell me why? Not sure what is going on here... Here is a link to the development site where you can see the problem I am having (I did not design it, but I am in charge of changing to html). http://www.vismarkgroup.com/dev/Kyrie/about.html Thanks!! I am trying to get three colums of work, picture on the left, text middle, pictures on the right. should I be working with nested tables? attached a pix to show what I mean, Hello, I've been looking at this problem for a few hours now and can't see what i'm doing wrong. I just want to nest 2 tables inside 1 row of another table. Problem can be seen and you can view source at http://www.lakesdt.com/testindex.html Can anyone tell me where i've gone wrong? I'm using Notepad++ so that can confirm all my <tr> and <td>'s seem to match up. Any help much appreciated! Also open to suggestions for a better way to implement this, and also as each link on the left will load a page in the right is there a neater way to do this without reloading the whole page again? Best regards, Matt Hi, Thanks in advance for your help. I'm doing a web page that I would like to be viewed on 1024 resolutions without a horizontal scrollbar. It will contain images that are exactly 980px wide. The problem is that with ie7, as soon as it contains a div or a table, no matter what I do to try to remove all padding,margins,etc.. it adds 2px for each element (I guess 1px for each side). Below is some html as an example of my problem, where I've tried to remove everything I can think of... this works fine in firefox 3 <body style="width:998px;margin-top:0;margin-left:0;margin-right:0;padding:0;"> <div style="width:100%;textalign:center"><table border="0" cellspacing="0" cellpadding="0" style="width:998px;border-collapse:collapse;padding:0;margin:0;border:0;"><tr style="padding:0;margin:0;border:0;"><td style="padding:0;margin:0;border:0;">sdfsdfd</tr></td></table><div style="width:100%> </body> Hi, I'm new to HTML. I have not yet started using CSS. I'm just using basic html. I'm having problem creating a nested table as shown in the attachment without using CSS style sheets. I appreciate anyone's suggestions in this. I pasted the code that tried below. <h3> 5) - Nested Table </h3> <table align="left" width="350" bgcolor="#ffff00" border="1"> <tr height="75" align="left"> <td height="100" > </td> <td height="75"> test2 </td> <td height="75"> </td> </tr> <clear="left" /> <tr> <td> <table align="left" bgcolor="f5f5dc" border="1"> <tr> <td width="100%" height="75"> a nested table </td> <td width="100%" height="75"> With this text at the top </td> </tr> <tr> <td width="100%" height="75"> </td> <td width="100%" height="75"> </td> </tr> </table> </td> </tr> <tr height="75" align="left"> <td></td> <td></td> <td></td> </tr> </table> Thanks in advance Hi. I'm working on a fairly complicated web form and need to align input boxes horizontally across a lefthand column, a multi-row nested table, and a righthand column. This works OK (as long as cellpad and cellspace are set to 0) except that at one point I need to put text in the right-hand column instead of an input box, and this throws the alignment out. The simplified code below shows what I mean. As given below the boxes are aligned properly. But if you comment out the version A row and substitute the version B row, the alignment goes. Can anyone explain why this happens, and whether there's a way round it ? The form in question does have to be a table, by the way. Would be grateful for any suggestions ! Thanks Dedge <form> <table width='100%' cellspacing='0' cellpadding='0' border='0'> <tr> <td>Item name</td> <td rowspan='5'> <table cellspacing='0' cellpadding='0' border='0'> <tr> <td><input name='i1' id='i1' size='1' maxlength='1'></td> <td><input name='i2' id='i2' size='1' maxlength='1'></td> </tr> <tr> <td><input name='i3' id='i3' size='1' maxlength='1'></td> <td><input name='i4' id='i4' size='1' maxlength='1'></td> </tr> <tr> <td><input name='i5' id='i5' size='1' maxlength='1'></td> <td><input name='i6' id='i6' size='1' maxlength='1'></td> </tr> <tr> <td><input name='i7' id='i7' size='1' maxlength='1'></td> <td><input name='i8' id='i8' size='1' maxlength='1'></td> </tr> <tr> <td><input name='i7' id='i7' size='1' maxlength='1'></td> <td><input name='i8' id='i8' size='1' maxlength='1'></td> </tr> </table> </td> <td>Item name</td> <td><input name='ia' id='ia' size='1' maxlength='1'></td> </tr> <tr> <td>Item name</td> <td>Item name</td> <td><input name='ib' id='ib' size='1' maxlength='1'></td> </tr> <tr> <td>Item name</td> <td>Item name</td> <td><input name='ic' id='ic' size='1' maxlength='1'></td> </tr> <!--VERSION A--> <tr> <td>Item name</td> <td>Item name</td> <td><input name='ic' id='ic' size='1' maxlength='1'></td> </tr> <!--END OF VERSION A--> <!--VERSION B--> <!--<tr> <td>Item name</td> <td colspan='2' align='right'>SOME TEXT</td> </tr>--> <!--END OF VERSION B--> <tr> <td>Item name</td> <td>Item name</td> <td><input name='ie' id='ie' size='1' maxlength='1'></td> </tr> </table> </form> HI Every Body, Can you please help to resolve this issue. I am trying to create nested tables using the following code but no luck . In IE 7.0.6 the Nested tables are getting displayed as two seperate table. <HTML> <Head> <Title> MY First Application </Title> </Head> <Body> <Table border=1 Height=750 width=540 BORDERCOLOR=Red > <Tr> <Td> This is my first row/column </Td> </Tr> <Tr> <Table border=1 Height=130 Width=540 > <Tr> <Td> This is my firstcolumn in nested table</Td> <Td>This is my second column in nested table</Td> </Tr> </Table </Tr> </Table> </Body> </HTML> PLease let me know the solution Thanks in advance. Regards, Eswar |
|||||||