hide column and row line in a table without disable the table border

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • ammyra91
    New Member
    • Nov 2011
    • 18
    #1

    hide column and row line in a table without disable the table border

    hello evrybdy...

    i need help...i wanna make a table that there is no column or row line exist in the table. yes,i want the border of the table line to be seen....

    here's are my coding....

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function validate_form()
{
	var valid=true;
    if(document.form.username.value=="")
    {
    	alert(" Please fill in the ' User Name ' textbox. ");
        document.form.username.focus();
        valid=false;
	}
    
    if(document.form.password.value=="")
    {
    	alert(" Please fill in the ' Password ' box. ");
        document.form.password.focus();
        valid=false;
	}
    return valid;
}
</script>
<style type="text/css">
<!--
.style1 {
	font-family: "Courier New", Courier, monospace;
	font-size: 36px;
	color: #000000;
}
.style2 {
	font-size: 36px;
	color: #000099;
}
-->
</style>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>

<body>
<form name="form" method="post" action="login0.php" onSubmit="return validate_form();">
<div align="center">
  <table width="881" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCFF99">
    <!--DWLayoutTable-->
    <tr>
      <td height="35" colspan="5" valign="top" bgcolor="#FF6600"><!--DWLayoutEmptyCell-->&nbsp;</td>
    </tr>
    <tr>
      <td height="129" colspan="5" valign="top" bgcolor="#99FFCC"><!--DWLayoutEmptyCell-->&nbsp;</td>
    </tr>
    <tr>
      <td width="49" height="43"></td>
      <td width="348"></td>
      <td width="55"></td>
      <td width="376"></td>
      <td width="53"></td>
    </tr>
    <tr>
      <td height="307">&nbsp;</td>
      <td valign="top"><p class="style2">JKN Perlis&nbsp;</p>
        <p><br>
          Menggembleng tenaga ke arah kesihatan masyarakat yang lebih baik.</p>
        <p>&nbsp;</p>        <p>Komited untuk memperkasakan masyarakat Perlis bagi mambuat keputusan yang bijak <br />
      terhadap kesihatan diri dan keluarga </p></td>
      <td>&nbsp;</td>
      <td rowspan="2" align="center" valign="middle"><div align="center">
        <table border="3" bgcolor="#F0F0F0">
            <!--DWLayoutTable-->
            <tr>
              <td width="285" height="57" align="center" valign="middle"><p align="center"><em><code>Don't have an ID?</code></em></p>              </td>
            </tr>            
            <tr>
              <td height="42" valign="top"><div align="center"><a href="main.php"><img src="button_0.jpg" alt="Create Account" width="281" height="32"></a></div></td>
            </tr>
            <tr>
              <td height="165" valign="top" border="0"><table border="0" align="center">
<tbody>
<tr>
<td align="center" valign="middle" style="text-align: center;">
<p align="center"><strong>	LOGIN	</strong></p>
<div align="center">
  <table border="0" cellspacing="1" cellpadding="3" >
    <tbody>
      
      <tr align="center" bgcolor="#FFFFFF">
        <td><span style="font-family: Arial; font-size: small;">Username</span></td>
    <td><span style="font-family: Arial; font-size: small;">	:	</span></td>
    <td><span style="font-family: Arial; font-size: small;"><input name="username" type="text"></span></td>
    </tr>
      
      <tr align="center" bgcolor="#FFFFFF">
        <td><span style="font-family: Arial; font-size: small;">Password</span></td>
    <td><span style="font-family: Arial; font-size: small;">	:	</span></td>
    <td><span style="font-family: Arial; font-size: small;"><input name="password" type="password"></span></td>
    </tr>
      
    <tr></tr><tr></tr>
    
    <tr>
    
    <td colspan=3 align=center><input name="Submit" type="Submit" value="Login">
    <input name="reset" type="reset" value="Reset"></td>
    
    </tr>
</p>
</table>
</div></td>
</tr>
</tbody>
</table>&nbsp;</td>
            </tr>
        </table>
        </div>        <p align="center">&nbsp;</p></td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td height="120">&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td height="76"></td>
      <td></td>
      <td></td>
      <td>&nbsp;</td>
      <td></td>
    </tr>
    <tr>
      <td height="90" colspan="5" valign="top" bgcolor="#FFFF99"><!--DWLayoutEmptyCell-->&nbsp;</td>
    </tr>
  </table>
</div></form>
</body>
</html>
    this is my current website....(ima ge website-table.jpg)
    this is the website that i want to have.....(image website-table2.jpg).... this picture was made by using photoshop....

    any respond would help....tq
    Attached Files
    Last edited by Dormilich; Jan 5 '12, 11:53 AM. Reason: please use [CODE] [/CODE] tags when posting code
    Tags: hide column line, row line, table
    • zorgi
      Recognized Expert Contributor
      • Mar 2008
      • 431
      #2
      You can achieve what you want by nesting two tables. Outer table would have one row and one column and border = x. Inner table would have one column and 3 rows with border set to 0.

      You could also try css. something like:

      Code:
                  table{
                border-width: 3px;
            }
            tr, td{
                border-width: 0px;
            }

        Comment

        Previous template Next
        Working...