Nunzio's Message Board Forum Index
Nunzio's Message Board

 
 FAQFAQ   SearchSearch   MemberlistMemberlist   UsergroupsUsergroups   RegisterRegister 
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 

Using rowspan and colspan to control the layout of tables

 
Post new topic   This topic is locked: you cannot edit posts or make replies.    Nunzio's Message Board Forum Index -> HTML FAQ (tips & tricks)
View previous topic :: View next topic  
Author Message
Nunzio
Site Admin


Joined: 08 Aug 2003
Posts: 90
Location: Tharsis Ridge (Martian lowlands)

PostPosted: Sat Aug 09, 2003 8:42 am    Post subject: Using rowspan and colspan to control the layout of tables Reply with quote

Rowspan and colspan are attributes of the TD element. Rowspan determines the number of rows that a cell will "span" or spread across while colspan controls the number of columns. The number of cells in a row or column must be uniform throughout the table whether as a spanned number or actual cells. The "normal" table below has four columns and three rows...
Colspan=1, Rowspan=1Colspan=1, Rowspan=1Colspan=1, Rowspan=1Colspan=1, Rowspan=1
Colspan=1, Rowspan=1Colspan=1, Rowspan=1Colspan=1, Rowspan=1Colspan=1, Rowspan=1
Colspan=1, Rowspan=1Colspan=1, Rowspan=1Colspan=1, Rowspan=1Colspan=1, Rowspan=1

Note that you do not have to actually use the colspan and rowspan attributes to state the value if it only spans one cell, it is an intrinsic value. The markup below shows how this table was made:
Code:
<table width="500" border="1" cellspacing="1" cellpadding="1"
       align="center">
 <tbody>
  <tr>
   <td width="25%" align="center">Colspan=1, Rowspan=1</td>
   <td width="25%" align="center">Colspan=1, Rowspan=1</td>
   <td width="25%" align="center">Colspan=1, Rowspan=1</td>
   <td width="25%" align="center">Colspan=1, Rowspan=1</td>
  </tr>
  <tr>
   <td align="center">Colspan=1, Rowspan=1</td>
   <td align="center">Colspan=1, Rowspan=1</td>
   <td align="center">Colspan=1, Rowspan=1</td>
   <td align="center">Colspan=1, Rowspan=1</td>
  </tr>
  <tr>
   <td align="center">Colspan=1, Rowspan=1</td>
   <td align="center">Colspan=1, Rowspan=1</td>
   <td align="center">Colspan=1, Rowspan=1</td>
   <td align="center">Colspan=1, Rowspan=1</td>
  </tr>
 </tbody>
</table>
Back to top
View user's profile Send private message Send e-mail Visit poster's website Yahoo Messenger
Display posts from previous:   
Post new topic   This topic is locked: you cannot edit posts or make replies.    Nunzio's Message Board Forum Index -> HTML FAQ (tips & tricks) All times are GMT - 5 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


Powered by phpBB © 2001, 2005 phpBB Group