Page 1 of 1

Problems aligning textfield and buttons in tables

Posted: Wed Jun 25, 2003 8:54 am
by alamaks
Hi there,

I am creating a custom login page that will bring the user to the main forum page, but the textfield that was created in the tables does not aligned properly with the images in my page. Below is the source code for the site. Can anyone help me with it?


Code:

Code: Select all

<html>
<head>
<title>VersionSeven</title>
<meta http-equiv="Content-Type" content="text/html;">
<!-- Fireworks MX Dreamweaver MX target.  Created Tue Jun 17 19:15:11 GMT+0800 (Malay Peninsula Standard Time) 2003-->
<link href="site01.css" rel="stylesheet" type="text/css">
<link href="fieldtxt.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#e6e6dc">
<TABLE height="6%" cellSpacing=0 cellPadding=0 width=100 align=center 
  border=0>
  <!--DWLayoutTable-->
  <TBODY>
  <TR>
    <TD height="30">&nbsp;</TD></TR></TBODY></TABLE>
<table border="0" cellpadding="0" cellspacing="0" width="752" align="center">
  <!--DWLayoutTable-->
<!-- fwtable fwsrc="Horiz_01slice.png" fwbase="index2.gif" fwstyle="Dreamweaver" fwdocid = "742308039" fwnested="0" -->
  <tr>
   <td width="120" height="1"><img src="images/spacer.gif" width="120" height="1" border="0" alt=""></td>
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td>
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td>
   <td width="411"><img src="images/spacer.gif" width="411" height="1" border="0" alt=""></td>
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td>
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td>
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td>
   <td width="172"><img src="images/spacer.gif" width="50" height="1" border="0" alt=""></td>
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td>
   <td width="1"><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  </tr>

  <tr>
   <td height="9" colspan="9"><img name="r1_c1" src="images/bar_ho.gif" width="751" height="9" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="9" border="0" alt=""></td>
  </tr>
  <tr>
   <td height="23"><img src="images/r2_c1.gif" alt="" name="r2_c1" width="120" height="23" border="0" usemap="#r2_c1Map"></td>
   <td rowspan="8"><img name="r2_c2" src="images/r2_c2.gif" width="8" height="349" border="0" alt=""></td>
   <td colspan="3"><img src="images/r2_c3.gif" alt="" name="r2_c3" width="427" height="23" border="0" usemap="#r2_c3Map"></td>
   <td rowspan="8"><img name="r2_c6" src="images/r2_c6.gif" width="8" height="349" border="0" alt=""></td>
   <td colspan="3"><img name="r2_c7" src="images/r2_c7.gif" width="188" height="23" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="23" border="0" alt=""></td>
  </tr>
  <tr>
   <td rowspan="7" valign="top" bgcolor="#FFFFFF"><img src="images/quo_01.gif" width="120" height="326"></td>
   <td rowspan="7"><img name="r3_c3" src="images/r3_c3.gif" width="8" height="326" border="0" alt=""></td>
   <td height="8"><img name="r3_c4" src="images/r3_c4.gif" width="411" height="8" border="0" alt=""></td>
   <td rowspan="7"><img name="r3_c5" src="images/r3_c5.gif" width="8" height="326" border="0" alt=""></td>
   <td rowspan="4"><img name="r3_c7" src="images/r3_c7.gif" width="8" height="66" border="0" alt=""></td>
   <td><img name="r3_c8" src="images/r3_c8.gif" width="172" height="8" border="0" alt=""></td>
   <td rowspan="4"><img name="r3_c13" src="images/r3_c13.gif" width="8" height="66" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td>
  </tr>
  <tr>
    <td rowspan="5"><img name="r4_c4" src="images/img_w_01.jpg" width="411" height="310" border="0" alt=""></td>
    <td height="45" valign="top"><table width="172" border="0" align="left" cellpadding="0" cellspacing="0">
        <!--DWLayoutTable-->
          <td width="172"> <form method='post' action='forums/login.php'>
  
  <table width='172' border='0' bordercolor='#0000CC' cellpadding='0' cellspacing='0' class=content>
      <!--DWLayoutTable-->
              <tr><td width='62' rowspan="2" align="left" valign="middle"><div align='left' class="fieldtext"><span class="fieldtext">User ID&nbsp;</span>&nbsp;</div>
              </td>
        <td width="51" rowspan="2" valign="top"> 
          <input name='username' type='text' size="8" class="verdana6">
          <b>        </b> </td>
      <td width="56" height="19" valign="top"><input type='hidden' name='redirect2' value='' />
        <b>
        <input type=hidden name=autologin2 value=1>
        </b></td>
              <td width="3"></td>
              </tr>
              <tr>
                <td rowspan="2" align="left" valign="top"><input type='submit' name='login' value='ok'>
                  </td>
        <td height="3"></td>
              </tr>
              <tr>
                <td rowspan="2" align="left" valign="middle"> 
                  <div align="left"><span class="fieldtext">Password<b>&nbsp; </b></span> </div>
                </td>
          <td rowspan="2" valign="top"><b> 
          <input name='password' type='password' size="8" class="verdana6">
                                                                                                                                                                                                                                                                                                                                                                      </b> </td>
          <td height="21"></td>
              </tr>
              <tr>
                <td height="1"></td>
                <td></td>
              </tr>
              <tr>
                <td height='1'></td>
                <td></td>
                <td></td>
                <td></td>
              </tr>
    </table>
  </form></td>
        </tr>
    </table>
    </td>
    <td rowspan="2"><img src="images/spacer.gif" width="1" height="50" border="0" alt=""></td>
  </tr>
  <tr>
    <td height="5"></td>
  </tr>
  <tr>
    <td height="8"><img name="r5_c8" src="images/r5_c8.gif" width="172" height="8" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td>
  </tr>
  <tr>
    <td height="8" colspan="3"><img name="r6_c7" src="images/r6_c7.gif" width="188" height="8" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td>
  </tr>
  <tr>
    <td colspan="3" rowspan="2" valign="top" bgcolor="#FFFFFF"><img src="images/txt_h_01.gif" width="188" height="252"></td>
   <td height="244"><img src="images/spacer.gif" width="1" height="244" border="0" alt=""></td>
  </tr>
  <tr>
    <td height="8"><img name="r8_c4" src="images/r8_c4.gif" width="411" height="8" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td>
  </tr>
  <tr>
   <td height="11" colspan="9"><img name="r9_c1" src="images/r9_c1.gif" width="751" height="11" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="11" border="0" alt=""></td>
  </tr>
  <tr>
   <td height="19" colspan="2"><img name="r10_c1" src="images/r10_c1.gif" width="128" height="19" border="0" alt=""></td>
   <td colspan="3"><img name="r10_c3" src="images/r10_c3.gif" width="427" height="19" border="0" alt=""></td>
   <td colspan="4"><img name="r10_c6" src="images/r10_c6.gif" width="196" height="19" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="19" border="0" alt=""></td>
  </tr>
</table>
<p class="fieldtext">&nbsp;</p>
<p class="fieldtext">&nbsp;</p>
<p class="fieldtext">
  <map name="r2_c1Map">
    <area shape="rect" coords="2,1,56,15" href="http://www.versionseven.com/forums/index.php" alt="VersionSeven Forums">
  </map>
  <map name="r2_c3Map">
    <area shape="rect" coords="81,1,142,16" href="company.htm">
    <area shape="rect" coords="171,1,233,16" href="solution.htm">
    <area shape="rect" coords="263,1,322,16" href="pfolio.htm">
    <area shape="rect" coords="351,1,423,16" href="contact.htm">
    <area shape="rect" coords="5,1,48,16" href="index.php">
  </map>
</p>
</body>
</html>

Posted: Wed Jun 25, 2003 11:20 am
by phice

Code: Select all

<html> 
<head> 
<title>VersionSeven</title> 
<meta http-equiv="Content-Type" content="text/html;"> 
<!-- Fireworks MX Dreamweaver MX target.  Created Tue Jun 17 19:15:11 GMT+0800 (Malay Peninsula Standard Time) 2003--> 
<link href="site01.css" rel="stylesheet" type="text/css"> 
<link href="fieldtxt.css" rel="stylesheet" type="text/css"> 
</head> 
<body bgcolor="#e6e6dc"> 
<TABLE height="6%" cellSpacing=0 cellPadding=0 width=100 align=center 
  border=0> 
  <!--DWLayoutTable--> 
  <TBODY> 
  <TR> 
    <TD height="30"> </TD></TR></TBODY></TABLE> 
<table border="0" cellpadding="0" cellspacing="0" width="752" align="center"> 
  <!--DWLayoutTable--> 
<!-- fwtable fwsrc="Horiz_01slice.png" fwbase="index2.gif" fwstyle="Dreamweaver" fwdocid = "742308039" fwnested="0" --> 
  <tr> 
   <td width="120" height="1"><img src="images/spacer.gif" width="120" height="1" border="0" alt=""></td> 
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td> 
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td> 
   <td width="411"><img src="images/spacer.gif" width="411" height="1" border="0" alt=""></td> 
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td> 
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td> 
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td> 
   <td width="172"><img src="images/spacer.gif" width="50" height="1" border="0" alt=""></td> 
   <td width="8"><img src="images/spacer.gif" width="8" height="1" border="0" alt=""></td> 
   <td width="1"><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td> 
  </tr> 

  <tr> 
   <td height="9" colspan="9"><img name="r1_c1" src="images/bar_ho.gif" width="751" height="9" border="0" alt=""></td> 
   <td><img src="images/spacer.gif" width="1" height="9" border="0" alt=""></td> 
  </tr> 
  <tr> 
   <td height="23"><img src="images/r2_c1.gif" alt="" name="r2_c1" width="120" height="23" border="0" usemap="#r2_c1Map"></td> 
   <td rowspan="8"><img name="r2_c2" src="images/r2_c2.gif" width="8" height="349" border="0" alt=""></td> 
   <td colspan="3"><img src="images/r2_c3.gif" alt="" name="r2_c3" width="427" height="23" border="0" usemap="#r2_c3Map"></td> 
   <td rowspan="8"><img name="r2_c6" src="images/r2_c6.gif" width="8" height="349" border="0" alt=""></td> 
   <td colspan="3"><img name="r2_c7" src="images/r2_c7.gif" width="188" height="23" border="0" alt=""></td> 
   <td><img src="images/spacer.gif" width="1" height="23" border="0" alt=""></td> 
  </tr> 
  <tr> 
   <td rowspan="7" valign="top" bgcolor="#FFFFFF"><img src="images/quo_01.gif" width="120" height="326"></td> 
   <td rowspan="7"><img name="r3_c3" src="images/r3_c3.gif" width="8" height="326" border="0" alt=""></td> 
   <td height="8"><img name="r3_c4" src="images/r3_c4.gif" width="411" height="8" border="0" alt=""></td> 
   <td rowspan="7"><img name="r3_c5" src="images/r3_c5.gif" width="8" height="326" border="0" alt=""></td> 
   <td rowspan="4"><img name="r3_c7" src="images/r3_c7.gif" width="8" height="66" border="0" alt=""></td> 
   <td><img name="r3_c8" src="images/r3_c8.gif" width="172" height="8" border="0" alt=""></td> 
   <td rowspan="4"><img name="r3_c13" src="images/r3_c13.gif" width="8" height="66" border="0" alt=""></td> 
   <td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td> 
  </tr> 
  <tr> 
    <td rowspan="5"><img name="r4_c4" src="images/img_w_01.jpg" width="411" height="310" border="0" alt=""></td> 
    <td height="45" valign="top"><table width="172" border="0" align="left" cellpadding="0" cellspacing="0"> 
        <!--DWLayoutTable--> 
          <td width="172">
  
  <table width='172' border='0' bordercolor='#0000CC' cellpadding='0' cellspacing='0' class=content> 
 <form method='post' action='forums/login.php'> 
      <!--DWLayoutTable--> 
              <tr><td width='62' rowspan="2" align="left" valign="middle"><div align='left' class="fieldtext"><span class="fieldtext">User ID </span> </div> 
              </td> 
        <td width="51" rowspan="2" valign="top"> 
          <input name='username' type='text' size="8" class="verdana6"> 
          <b>        </b> </td> 
      <td width="56" height="19" valign="top"><input type='hidden' name='redirect2' value='' /> 
        <b> 
        <input type=hidden name=autologin2 value=1> 
        </b></td> 
              <td width="3"></td> 
              </tr> 
              <tr> 
                <td rowspan="2" align="left" valign="top"><input type='submit' name='login' value='ok'> 
                  </td> 
        <td height="3"></td> 
              </tr> 
              <tr> 
                <td rowspan="2" align="left" valign="middle"> 
                  <div align="left"><span class="fieldtext">Password<b>  </b></span> </div> 
                </td> 
          <td rowspan="2" valign="top"><b> 
          <input name='password' type='password' size="8" class="verdana6"> 
                                                                                                                                                                                                                                                                                                                                                                      </b> </td> 
          <td height="21"></td> 
              </tr> 
              <tr> 
                <td height="1"></td> 
                <td></td> 
              </tr> 
              <tr> 
                <td height='1'></td> 
                <td></td> 
                <td></td> 
                <td></td> 
              </tr> 
  </form></table> 
</td> 
        </tr> 
    </table> 
    </td> 
    <td rowspan="2"><img src="images/spacer.gif" width="1" height="50" border="0" alt=""></td> 
  </tr> 
  <tr> 
    <td height="5"></td> 
  </tr> 
  <tr> 
    <td height="8"><img name="r5_c8" src="images/r5_c8.gif" width="172" height="8" border="0" alt=""></td> 
   <td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td> 
  </tr> 
  <tr> 
    <td height="8" colspan="3"><img name="r6_c7" src="images/r6_c7.gif" width="188" height="8" border="0" alt=""></td> 
   <td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td> 
  </tr> 
  <tr> 
    <td colspan="3" rowspan="2" valign="top" bgcolor="#FFFFFF"><img src="images/txt_h_01.gif" width="188" height="252"></td> 
   <td height="244"><img src="images/spacer.gif" width="1" height="244" border="0" alt=""></td> 
  </tr> 
  <tr> 
    <td height="8"><img name="r8_c4" src="images/r8_c4.gif" width="411" height="8" border="0" alt=""></td> 
   <td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td> 
  </tr> 
  <tr> 
   <td height="11" colspan="9"><img name="r9_c1" src="images/r9_c1.gif" width="751" height="11" border="0" alt=""></td> 
   <td><img src="images/spacer.gif" width="1" height="11" border="0" alt=""></td> 
  </tr> 
  <tr> 
   <td height="19" colspan="2"><img name="r10_c1" src="images/r10_c1.gif" width="128" height="19" border="0" alt=""></td> 
   <td colspan="3"><img name="r10_c3" src="images/r10_c3.gif" width="427" height="19" border="0" alt=""></td> 
   <td colspan="4"><img name="r10_c6" src="images/r10_c6.gif" width="196" height="19" border="0" alt=""></td> 
   <td><img src="images/spacer.gif" width="1" height="19" border="0" alt=""></td> 
  </tr> 
</table> 
<p class="fieldtext"> </p> 
<p class="fieldtext"> </p> 
<p class="fieldtext"> 
  <map name="r2_c1Map"> 
    <area shape="rect" coords="2,1,56,15" href="http://www.versionseven.com/forums/index.php" alt="VersionSeven Forums"> 
  </map> 
  <map name="r2_c3Map"> 
    <area shape="rect" coords="81,1,142,16" href="company.htm"> 
    <area shape="rect" coords="171,1,233,16" href="solution.htm"> 
    <area shape="rect" coords="263,1,322,16" href="pfolio.htm"> 
    <area shape="rect" coords="351,1,423,16" href="contact.htm"> 
    <area shape="rect" coords="5,1,48,16" href="index.php"> 
  </map> 
</p> 
</body> 
</html>

I placed the <form> and </form> tags outside of the <tr> tags and inside the <table> tags so there wont be unspecified spaces.