HTML Tutorial


 Forum HomeForum Home   FAQFAQ   SearchSearch   MemberlistMemberlist   RegisterRegister 
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 
RegisterRegister - Not registered yet? Got something to say? Join HTML Code Tutorial!
Table nightmare
Post new topic   Reply to topic    HTML Help Forum Index -> HTML Table
View previous topic :: View next topic  
Author Message
ckp_hokie



Joined: 03 Aug 2005
Posts: 12
Location: VA

PostPosted: Wed Aug 03, 2005 1:20 pm     Table nightmare Reply with quote

I am working on a site and when I wrote the code in HTML on my Mac everything looked great. When I view it on PC everything is so wrong!!
I though it was the <div> tags I used but I removed them and am still clueless.

Here's the link to the problem: http://www.groupmarketing.com/training/unit2.4.html

After the third table the user is supposed to see the "Click here" button I made and below that a line of page numbers (like on unit2.3.html). They now appear on the right of the third table at the top. I have spent three hours trying to go back and see what I did wrong, but have no clue. I am new to this and really am stressed out.

Any help would be soooo helpful right now. Crying or Very sad

Is their any way to force the button and page numbers to the bottom???
Corey Bryant
Site Admin


Joined: 15 May 2004
Posts: 8316
Location: Castle Pines North, CO USA

PostPosted: Wed Aug 03, 2005 1:42 pm     Reply with quote



Something like
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Net Sales Training Program</title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<SCRIPT LANGUAGE="JavaScript">
<!--

function newImage(arg) {
   if (document.images) {
      rslt = new Image();
      rslt.src = arg;
      return rslt;
   }
}

function changeImages() {
   if (document.images && (preloadFlag == true)) {
      for (var i=0; i<changeImages.arguments.length; i+=2) {
         document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
      }
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit1_01_over = newImage("images/Unit1_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit2_01_over = newImage("images/Unit2_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit3_01_over = newImage("images/Unit3_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit4_01_over = newImage("images/Unit4_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit5_01_over = newImage("images/Unit5_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit6_01_over = newImage("images/Unit6_01-over.gif");
      preloadFlag = true;
   }
}      

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit7_01_over = newImage("images/Unit7_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit8_01_over = newImage("images/Unit8_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit9_01_over = newImage("images/Unit9_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      Unit10_01_over = newImage("images/Unit10_01-over.gif");
      preloadFlag = true;
   }
}

var preloadFlag = false;
function preloadImages() {
   if (document.images) {
      here_01_over = newImage("images/here_01-over.gif");
      preloadFlag = true;
   }
}

// -->
</SCRIPT>
<style type="text/css">
a:link {  color: #5678BB; text-decoration: none}
a:visited {  color: #5678BB; text-decoration: none}
a:hover {  color: #FFCC66; text-decoration: none}
.logo {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 26px; font-weight: bold; color: #FFFFFF}
.text {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #333333}
.title {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: bold; color: #5678BB}
.menu {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #333333}
.sub {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: plain; color: #333333}
.page {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: plain; color: #333333}
.menu2 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #5678BB}
.menu3 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF}
</style>
</head>
<p>&nbsp;</p>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" BACKGROUND="images/lines.gif" ONLOAD="preloadImages();">
<center>
<table width="780" cellspacing="0" cellpadding="0" align="center" STYLE="border-top:2px solid #5678BB;border-left:2px solid #5678BB; border-right:2px solid #5678BB;">
  <tr>
    <td width="780" height="75"><img src="images/bg2.jpg">
    </td>
  </tr>
  <tr>
    <td height="22" colspan="2" bgcolor="#999999">
      <table width="100%" cellspacing="0" cellpadding="0" border="0">
        <tr>
          <td height="18" bgcolor="#FFCC66" class="text" align="center"></td>
        </tr>
        <tr>
          <td height="4" bgcolor="#5678BB" class="text" align="center"></td>
        </tr>
      </table>
    </td>
  </tr>
</table>
<table width="780" cellspacing="0" cellpadding="0" border="0" align="center" STYLE="border-left:2px solid #5678BB; border-right:2px solid #5678BB;">
  <tr>
    <td bgcolor="#dcdcdc" height="250" valign="top" width="180">
      <table width="100%" cellspacing="0" cellpadding="8" border="0">
        <tr>
          <td bgcolor="#dcdcdc" width="200" valign="top"> <br>
       <table width="160" border="0" align="center" cellpadding="3" cellspacing="6" class="menu">
        <tr>
          <td><A HREF="index.html"
               ONMOUSEOVER="changeImages('Unit1_01', 'images/Unit1_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit1_01', 'images/Unit1_01.gif'); return true;">
            <IMG NAME="Unit1_01" SRC="images/Unit1_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="unit2.html"
               ONMOUSEOVER="changeImages('Unit2_01', 'images/Unit2_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit2_01', 'images/Unit2_01.gif'); return true;">
            <IMG NAME="Unit2_01" SRC="images/Unit2_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="#"
               ONMOUSEOVER="changeImages('Unit3_01', 'images/Unit3_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit3_01', 'images/Unit3_01.gif'); return true;">
            <IMG NAME="Unit3_01" SRC="images/Unit3_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="#"
               ONMOUSEOVER="changeImages('Unit4_01', 'images/Unit4_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit4_01', 'images/Unit4_01.gif'); return true;">
            <IMG NAME="Unit4_01" SRC="images/Unit4_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="#"
               ONMOUSEOVER="changeImages('Unit5_01', 'images/Unit5_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit5_01', 'images/Unit5_01.gif'); return true;">
            <IMG NAME="Unit5_01" SRC="images/Unit5_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="#"
               ONMOUSEOVER="changeImages('Unit6_01', 'images/Unit6_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit6_01', 'images/Unit6_01.gif'); return true;">
            <IMG NAME="Unit6_01" SRC="images/Unit6_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="#"
               ONMOUSEOVER="changeImages('Unit7_01', 'images/Unit7_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit7_01', 'images/Unit7_01.gif'); return true;">
            <IMG NAME="Unit7_01" SRC="images/Unit7_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="#"
               ONMOUSEOVER="changeImages('Unit8_01', 'images/Unit8_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit8_01', 'images/Unit8_01.gif'); return true;">
            <IMG NAME="Unit8_01" SRC="images/Unit8_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="#"
               ONMOUSEOVER="changeImages('Unit9_01', 'images/Unit9_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit9_01', 'images/Unit9_01.gif'); return true;">
            <IMG NAME="Unit9_01" SRC="images/Unit9_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
        <tr>
          <td><A HREF="#"
               ONMOUSEOVER="changeImages('Unit10_01', 'images/Unit10_01-over.gif'); return true;"
               ONMOUSEOUT="changeImages('Unit10_01', 'images/Unit10_01.gif'); return true;">
            <IMG NAME="Unit10_01" SRC="images/Unit10_01.gif" WIDTH=150 HEIGHT=45 BORDER=0></A></td>
        </tr>
      </table>     
    </td>
   
    <td width="580" bgcolor="#ffffff" valign="top">
      <table width="580" cellspacing="0" cellpadding="0" align="center" border="0">
       <tr>
          <td valign="top" class="text">
            <p><span class="title"><br>UNIT TWO: </span><span class="sub">
         Identifying Member Needs From Everyday Clues</span></p>
        <p><span class="menu">Table 1</span><br>
        <table width="560" bgcolor="#EAF5FE" cellspacing="0" cellpadding="8" align="top" border="2" bordercolor="#5678BB">
      <tr>
         <td colspan="4" bgcolor="#5678BB">
            <p align="center"><b><span class="menu3">ABBREVIATIONS OF TYPICAL
         CREDIT UNION SERVICES</span></b></p>
       </td>
       </tr>
        <tr>
           <td><b><span class="text">SSA<br>SDA<br>SCA<br>PL<br>HEL<br>HELC<br>
         ML<br>AP<br>ATM</span></b></td>
           <td align="center"><b><span class="text">Share Savings Account<br>
         Share Draft Account<br>Share Certificate Account
           <br>Personal Loans<br>Home Equity Loan<br>Home Equity Line of Credit<br>
         Mortgage Loan<br>Auto Pay<br>Automated Teller Machine</span></b></td>
           <td align="center"><b><span class="text">AUTO<br>EL<br>IRA<br>V/MC<br>
         CC<br>DD<br>HB<br>TC<br>CLI</span></b></td>
            <td align="center"><b><span class="text">Auto Loan<br>Education Loan<br>
         Individual Retirement Account<br>Visa or Mastercard
            <br>Checkcard<br>Direct Deposit<br>Home Banking<br>Travelers Checks<br>
         Credit Life Insurance</span></b></td>
         </tr>
      </table>
        </p>
        <p><span class="menu">Table 2</span><br>
      <table width="560" bgcolor="#EAF5FE" cellspacing="0" cellpadding="8" align="top" border="2" bordercolor="#5678BB">
      <tr>
         <td colspan="4" bgcolor="#5678BB">
            <p align="center"><b><span class="menu3">CLUE SOURCES</span></b></p>
       </td>
       </tr>
        <tr><td><p align="center"><span class="text"><b>1. Members'
         Conversations<br>2. Member Demographics<br>3. Account or Transaction
         Information</b></span>
      </p></td></tr>      
      </table>
      </p>
        <p><span class="menu">SITUATIONS</span><br>
        <table width="560" bgcolor="#EAF5FE" cellspacing="0" cellpadding="8" align="left" border="2" bordercolor="#5678BB">
      <form>
      <tr>
          <td colspan="2">
            <p align="center"><b><span class="menu">MEMBER SITUATIONS THAT
         REVEAL POTENTIAL NEEDS</span></b></p>
        </td>
        <td align="center"><span class="menu">Column<br>1</span></td>
        <td align="center"><span class="menu">Coulmn<br>2</span></td>
       </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">EX. A member making a savings
         withdrawal complains about office hours.</span></b></td>
           <td align="center"><b><span class="text">ATM</span></b></td>
           <td align="center"><b><span class="text">1</span></b></td>
        </tr> 
        <tr>
           <td colspan="2"><b><span class="text">1. A member is making a deposit
         to her Share Savings Account with a personal check drawn on a local
         bank.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 1a" size="5"></td>
           <td align="center"><input type="text" name="Answer 1b" size="5"></td>
        </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">2. A member comes in to deposit
         $25,000 to her Statement Savings Account.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 2a" size="5"></td>
           <td align="center"><input type="text" name="Answer 2b" size="5"></td>
        </tr>
        <tr>
           <td colspan="2"><b><span class="text">3. A member proudly informs you
         that her son will be starting college soon.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 3a" size="5"></td>
           <td align="center"><input type="text" name="Answer 3b" size="5"></td>
        </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">4. A credit worthy member is
         disappointed that he is not able to get immediate approval on a
         loan.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 4a" size="5"></td>
           <td align="center"><input type="text" name="Answer 4b" size="5"></td>
        </tr>
        <tr>
           <td colspan="2"><b><span class="text">5. A member with a Share Draft
         Account applies for an auto loan.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 5a" size="5"></td>
           <td align="center"><input type="text" name="Answer 5b" size="5"></td>
        </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">6. A member calls you to
         request a check to pay for car repairs.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 6a" size="5"></td>
           <td align="center"><input type="text" name="Answer 6b" size="5"></td>
        </tr>
        <tr>
           <td colspan="2"><b><span class="text">7. A member complains about
         having too many credit card bills.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 7a" size="5"></td>
           <td align="center"><input type="text" name="Answer 7b" size="5"></td>
        </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">8. A member is calling you for
         the fifth time this week to see what checks have cleared.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 8a" size="5"></td>
           <td align="center"><input type="text" name="Answer 8b" size="5"></td>
        </tr>
        <tr>
           <td colspan="2"><b><span class="text">9. A frustrated member rushes
         into the branch at closing time and complains that her car broke
         down again.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 9a" size="5"></td>
           <td align="center"><input type="text" name="Answer 9b" size="5"></td>
        </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">10. A member comes in every
         month to deposit her Retirement and Social Security checks.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 10a" size="5"></td>
           <td align="center"><input type="text" name="Answer 10b" size="5"></td>
        </tr>
        <tr>
           <td colspan="2"><b><span class="text">11. You have just approved a
         member for an auto loan.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 11a" size="5"></td>
           <td align="center"><input type="text" name="Answer 11b" size="5"></td>
        </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">12. A member mentions that he
         just bought a home computer.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 12a" size="5"></td>
           <td align="center"><input type="text" name="Answer 12b" size="5"></td>
        </tr>
        <tr>
           <td colspan="2"><b><span class="text">13. A member complains that
         most places won't accept personal checks.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 13a" size="5"></td>
           <td align="center"><input type="text" name="Answer 13b" size="5"></td>
        </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">14. A member proudly tells you
         about her new baby.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 14a" size="5"></td>
           <td align="center"><input type="text" name="Answer 14b" size="5"></td>
        </tr>
        <tr>
           <td colspan="2"><b><span class="text">15. A member complains about
         ATM fees at non-Credit Union locations.</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 15a" size="5"></td>
           <td align="center"><input type="text" name="Answer 15b" size="5"></td>
        </tr>
        <tr bgcolor="#FFFFBA">
           <td colspan="2"><b><span class="text">16. While making a savings
         deposit a member says, &quot;I can't believe how low your rates have
         dropped.&quot;</span></b>
           </td>
           <td align="center"><input type="text" name="Answer 16a" size="5"></td>
           <td align="center"><input type="text" name="Answer 16b" size="5"></td>
        </tr>
        </form>
      </table><br>

   </table>
    </td>
        <tr>
          <td bgcolor="#dcdcdc" width="200" valign="top"> &nbsp;</td>
   
    <td width="580" bgcolor="#ffffff" valign="top">
             <p align="center"><span class="menu"><A HREF="unit2_answers.html"
   ONMOUSEOVER="changeImages('here_01', 'images/here_01-over.gif'); return true;"
   ONMOUSEOUT="changeImages('here_01', 'images/here_01.gif'); return true;">
   <IMG NAME="here_01" SRC="images/here_01.gif" WIDTH=350 HEIGHT=24></A><br><br>&nbsp;
      <span class="page"><b>PAGE <a href="unit2.html">1</a>, <a href="unit2.2.html">
      2</a>, <a href="unit2.3.html">3</a>, 4, <a href="unit2_answers.html">5</a>, <a href="unit2.6.html">
      6</a></b></span></p></td>
 </table>

<table width="780" cellspacing="0" cellpadding="0" height="40" border="0" align="center">
  <tr>
   <td bgcolor="#5678BB" height="3" align="center"></td>
   </tr>
  <tr>
    <td bgcolor="#FFCC66" height="24" class="text" align="center" STYLE="border-bottom:2px solid #5678BB;">
   Copyright © 2005 Group Marketing Associates. All rights reserved.</td>
  </tr>
</table>
</table>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
        <tr>
          <td height="10" bgcolor="#FFFFFF" class="text" align="center" BACKGROUND="images/lines.gif"><p>
         &nbsp;</p></td>
        </tr>
</table>       
</center>
</body>
</html>
ckp_hokie



Joined: 03 Aug 2005
Posts: 12
Location: VA

PostPosted: Thu Aug 04, 2005 4:58 am     Reply with quote

Corey, Thanks for lookin at the source code. But when I plug your code in I get upper case E's with carots above them, all over the place. Any clue what's going on?
Corey Bryant
Site Admin


Joined: 15 May 2004
Posts: 8316
Location: Castle Pines North, CO USA

PostPosted: Thu Aug 04, 2005 5:55 am     Reply with quote

If you are using any type of a WYSIWYG editor, you will need to copy the code into notepad first and then paste that into your editor
ckp_hokie



Joined: 03 Aug 2005
Posts: 12
Location: VA

PostPosted: Thu Aug 04, 2005 8:10 am     Reply with quote

I am using BBEdit 6.5 on Mac, but realized the weird characters were from extra spaces. I've made it work. Thanks again. I knew it was something simple I was just missing.

One last thing, how can I make no border appear aroun the button at the bottom of the page? Its only this page where the border appears around the button/link.

http://www.groupmarketing.com/training/unit2.4.html
Corey Bryant
Site Admin


Joined: 15 May 2004
Posts: 8316
Location: Castle Pines North, CO USA

PostPosted: Thu Aug 04, 2005 8:22 am     Reply with quote

Usually this can be fixed by apply no border to the CSS file or to the image tag
Code:
border="0"
Display posts from previous:   
Post new topic   Reply to topic    HTML Help Forum Index -> HTML Table All times are GMT - 8 Hours
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
HTML Help Archive
Powered by phpBB © 2001, 2005 phpBB Group
HTML Help topic RSS feed 

 
HOSTING / DESIGN
MAKE MONEY

Home
  |   Tutorials   |   Forum   |   Quick List   |   Link Directory   |   About
Copyright ©1997-2002 Idocs and ©2002-2007 HTML Code Tutorial