HTML - Table Adding In Extra Height
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 Similar TutorialsI'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! My school's library has a really basic search, so I made a form with more options to search for books. The problem is that they have a lot of books in the catalog that are NetLibrary books. I can usually find just the dead-tree version by adding limiters and boolean operators, but I was wondering it is possible to make a form that would let me just type the book title and automatically add "not netlibrary" to it? I need help. I have a page but its centered. I still have white non used space on both sides that i would like to use to post links and what not but im not too great with tables. My test website is down below. Id like to keep the same dimensions of the page where it is now, but need to be able to use the blank white space on the sides to post links and extra text and what not. Can anyone help? www.militarycheapskate.com 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. 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> 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> 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? I will be brief in hoping that the issue does not require a thesis to properly fix. I'm dealing with tables within tables..within tables. In one instance, I have a 2x1 (row by column) table inside another table. So, we'll call the inside table "B" and the outside table "A". Table B is centered inside a column in Table A. I'm trying to maximize the space, but nearly nothing works. Setting Table B height=100% does nothing. The only thing that works is setting the height=N px, where N is a number. This is no good, as I want to the site to work on all resolutions. I want it to be proportional. How can I fix this? Here's what I'm dealing with, visually: Any help would be welcome. Thanks. I have a table row with a form with several buttons. The row is twice the height of the buttons and I haven't been able to control the height. Here is snippet: <html> <head> </head> <body> <center> <table border='1' cellpadding='0' cellspacing='0'> <tr> <td align='center'> <form> <input type='button' value='Prev month' id='btnPrevID' onClick='MonthYearChange("prev")'> <input type='button' value='Next month' id='btnNextID' onClick='MonthYearChange("next")'> <input type='button' value='Change Mo/Yr' id='btnChgID' onClick='DropDownChangeMonthYear()'> </form> </td> </tr> </table> </body> </html> Hi @ all! I am working on a layout with XHTML + CSS by use of a table, wich fills 100% of the browser window's height. Now here's my example: http://dennishoene.de.funpic.de/index2.html (Please just ignore the advt. popping up) I designed a simple grid for prospective contents. In Firefox, Safari and Opera it works fine, in IE not. I used fixed heights for the first line (30px), the second line (120px), the third line (30px) and the fifth line (30px). The fourth line should be variable (due to different screen resolutions), but in the end, the table should be of 100% height (see CSS-indications in <head>). It seems as the Internet Explorer simply does not take any notice of these values, whereas Firefox & the rest do (in detail: IE accepts the height: 100% statement, but ignores or deranges the fixed height values of the particular table cells/lines). How can I solve my problem? Any suggestions? Thanks in advance. Dennis Hello all, I am making a website with the lay-out based on a table (I know I shouldn't, when will I ever learn? ;-)). The problem is the following: I have divided my page into several blocks: The lowest <td> row has been set at 544px while the top row has been set at auto. Firefox gives the correct output. In IE the lowest row is longer than 544 px (the red line gives the height it should have, the red arrow points to the real hight). Putting the height on 100% doesn't help because it stretches the top row over the complete page, leaving the bottom row out of the screen (the positive side of this is that now the bottom row is 544 px as I had orderd it to)... So does anyone have advice for me (besides the fact that I should make my lay-out with div's: tried it, but it just doesnt work for me :-)). Thanks for the help, JuliusV ps. I've checked my code (html and css) with w3 and no errors have been found. Hi, I am looking to get a table along the side of my page to stretch from top to bottom. I tried <table height="100%"> and .high {height:100%} ... <table class="high"> but it didn't work it only shows until the end of the table's content. Is there a way to do this? Thanks Im having an issue with the table row heights on my page, i have three rows: The top row has the navigation menu, the second had a sub navigation menu (previous and next) to go between pages and then the third is has the content. I want the top to rows to snug up with the top of the table (like the top 25%) and then the content to be in the middle of the bottom row. Barring putting 'height="25%"' in the tr tag, is there a good way to do this? Thanks Hey... I am working on a site for me and my friends, and I have a question. See this website. As you can see I have used imagemapping to link the area where home is written, to bring you back to the frontpage. I would like to know how i could put a textbox or table inside the white square, or possibly a frame linked to the other sites. Code: Here is my HTML coding:<HTML> <HEAD> <TITLE>Calypto Productions Website</TITLE> </HEAD> <BODY bgcolor= "#000000"> <style type="text/css"> </style> <img src="http://calypto-productions.webs.com/atomicfrsteutkastdz0.png" usemap = #example border=0> <map name=example> <area shape=Rect Coords="262, 125 , 406, 170" Href="http://calypto-productions.webs.com/alt.htm/"> </map> </BODY> Hello I'm building a website for someone and because I built the website in a way that if the browser window width becomes smaller, the width of the content on the page becomes smaller as well, so the page's height increases. Normally, using height="100%" inside a image tag would work to get the image height to be the same as the height of the page, but because of some scripts I've had to use, that only seems to set the height of the image to its original size. Also, I can't use the CSS equivalent either, that still doesn't do the trick. So I was wondering if there is an alternative to the height property that I could use. By the way, the image is inside a table if that helps at all. Thanks Drider Hi, Please review the following code and give me your thoughts... HTML Code: <table width="500" border="1"><tr> <td width="200"><p>This</p><p>is</p><p>very</p><p>very</p><p>very</p><p>LONG</p><p>text</p></td> <td width="300" height ="100%" valign="top"> <table width="300" height ="100%" border="1" cellspacing="0"> <tr><td width="300" valign="top">This should be at the TOP</td></tr> <tr><td width="300" valign="bottom">This should be at the BOTTOM</td></tr> </table> </td> See the attachment for what I am trying to achieve... The thing to focus on is the second column and how it has 2 rows which are trying to stretch to fill the height of the single row first column. It works in Firefox 3.6 but not at all in IE8. Any ideas? And please don't talk me out of tables for this thread... I know they aren't the greatest thing ever, I'm just trying to fix what I have. Thanks! - Jeff Hello I have a very annoying problem: I have a table inside a td and I want the table the strech its height to the height of the <td> , but somehow I can't do it... <td valign="top" style="width:14px; border:solid 1px black;"> <table cellpadding="0" cellspacing="0" border="1" style="width:100%; height:100%; min-height:100%; max-height:100%" > <tr> <td class="CommonSeperetorUp" > </td> </tr> <tr> <td class="CommonSeperetorMiddle" > </td> </tr> <tr> <td class="CommonSeperetorDown" > </td> </tr> </table> </td> int the class "CommonSeperetorMiddle" I set the height to 100% ... anyone? Hi, My site is here I am having problems with the left side. It looks how I want it in Firefox but in IE it is ignoring my height commands and centering all the rows across the whole table. Anyone know how I can get this to look the same in Firefox and IE? Bit of a numpty so please be gentle Thanks Jon Hi Everyone: I'm having difficulty getting a table row height of "1" to display as only one pixel in height. Please see the attached files for reference. The JPG is what I want it to look like, and the index.txt file is the HTML I've currently setup that is not working. The table should have four white strips. On the right side, this is above and below the large black box, as well as under the green box. On the left side, this is between the light green box and the slightly darker green box. As you can see, all of these white strips appear to be larger than one pixel in height, and I'm not understanding why. Can anyone please explain to me why this is occurring, and what I can do to fix it? Also, once fixed, will I be able to merge cells of the same color (i.e make the big black box one merged cell, the below green box one merged cell, etc...)? Any help will be greatly appreciated. Thanks! Philip |