EchoEcho.Com Homepage
Web Hosting - As Reliable As It Gets!
   Home > D-Zine > Tables


 Tutorials 
 D-Zine Articles 
 Online Tools 
 Free Resources 
 References 
 Quiz 
 Hosting 

















  Tables :
Nesting Tips








When you create a table inside another table, it is called "nesting". This is a great alternative to merging cells if the situation requires it.

However, nesting tables can become very confusing when coding manually and can sometimes even become confusing in WYSIWYG Editors. There are two ways of making easy to work with nested tables, the first is by cleaning up your code.

Example of messy nested table code:
<TABLE cellpadding="0" cellspacing="10" border="5"><TR><TD>
<TABLE cellpadding="0" cellspacing="10" border="5"><TR><TD>
Content Goes Here</TD></TR></TABLE>
</TD><TD>More content goes here</TD></TR></TABLE>


Did you find that code difficult to understand? Actually, it's very simple, especially if we format it uniformly and with indents to allow people to see how deep the tables are:

<table cellpadding="0" cellspacing="10" border="5">
 <tr>
  <td> <!-- // BEGIN NESTED TABLE // -->
   <table cellpadding="0" cellspacing="10" border="5">
    <tr>
     <td>Content Goes Here</td>
    </tr>
   </table> <!-- // END NESTED TABLE // -->
  </td>
  <td>More content goes here</td>
 </tr>
</table>


The code above is easier to read because of two-space indents and clear comment tags. Dreamweaver, a popular WYSIWYG Editor, formats code similar to this, and for a good reason. The code above looks like this:

Content Goes Here
More content goes here


There is a nested table inside the left cell, and text inside the right cell.

 << PREVIOUS
READ MORE >>  
















DEVELOPER TIP!
FACT:
It takes about half a second for a server to respond to a request sent via the internet.
TIP:
If your page has 10 very small images - each with a size of 100 bytes - it will take longer to load than had it been a continuous stream of 1000 bytes.





     "Better Than Books - As Easy As It Gets!"


On EchoEcho: D-Zine Articles | Tutorials | Online Tools | Free Resources | References | Quiz | HostingAbout EchoEcho