SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. Sep 13, 2004, 00:38 #1
    dotJoon
    dotJoon is offline
    Get my greedy down dotJoon's Avatar
    Join Date
    Apr 2003
    Location
    daejeon, South Korea
    Posts
    2,184
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    cells without table

    Code:
    <table border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td  colspan ="7" height="1" bgcolor="black"></td>
	</tr>
	<tr>		
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center" height="30">cell 11</td>
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center">cell 12</td>
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center">cell 13</td>
		<td width="1" bgcolor="black"></td>
	</tr>
	<tr>
		<td  colspan ="7" height="1" bgcolor="black"></td>
	</tr>
	<tr>		
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center" height="30">cell 21</td>
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center">cell 22</td>
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center">cell 23</td>
		<td width="1" bgcolor="black"></td>
	</tr>
	<tr>
		<td  colspan ="7" height="1" bgcolor="black"></td>
	</tr>
	<tr>		
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center" height="30">cell 31</td>
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center">cell 32</td>
		<td width="1" bgcolor="black"></td>
		<td width="100" align="center">cell 33</td>
		<td width="1" bgcolor="black"></td>
	</tr>
	<tr>
		<td  colspan ="7" height="1" bgcolor="black"></td>
	</tr>
</table>
    The above code will show a table which has 9 cells.
    <table> is used in the above tag.
    I like to know whether we can make it without table?

    Can I make it using only CSS?

    How can I make the same result with the above result without table?

    Thanks in Advance
  2. Sep 13, 2004, 02:27 #2
    m0n5t3r
    m0n5t3r is offline
    SitePoint Enthusiast m0n5t3r's Avatar
    Join Date
    Jul 2003
    Location
    Romania
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeah, you can... but why?
    m0n5t3r's nest
    --
    earth is 98% full ... please delete anyone you can.
  3. Sep 13, 2004, 15:03 #3
    Paul O'B
    Paul O'B is offline
    The CSS Clinic is open
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    38,993
    Mentioned
    126 Post(s)
    Tagged
    3 Thread(s)
    Same why - but here you go
    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>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
#outer {
 width:302px;
 border:1px solid #000;
}
.cell1 {
 border-right:1px solid #000;
 border-bottom:1px solid #000;
}
.cell2 {border-right:1px solid #000;}
.cell3 {border-bottom:1px solid #000;}
.cell3 {border-bottom:1px solid #000;}
.cell4 {border-right:1px solid #000;}
.cell1, .cell2, .cell3,.cell4,.cell5 {
 width:100px;
 height:30px;
 line-height:30px;
 float:left;
 text-align:center;
}
</style>
</head>
<body>
<div id="outer"> 
  <div class="cell1">cell 11</div>
  <div class="cell1">cell 12</div>
  <div class="cell3">cell 13</div>
  <div class="cell1">cell 21</div>
  <div class="cell1">cell 22</div>
  <div class="cell3">cell 23</div>
  <div class="cell4">cell 31</div>
  <div class="cell4">cell 32</div>
  <div class="cell5">cell 33</div>
</div>
<table border="0" cellpadding="0" cellspacing="0">
  <tr> 
	<td  colspan ="7" height="1" bgcolor="black"></td>
  </tr>
  <tr> 
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center" height="30">cell 11</td>
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center">cell 12</td>
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center">cell 13</td>
	<td width="1" bgcolor="black"></td>
  </tr>
  <tr> 
	<td  colspan ="7" height="1" bgcolor="black"></td>
  </tr>
  <tr> 
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center" height="30">cell 21</td>
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center">cell 22</td>
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center">cell 23</td>
	<td width="1" bgcolor="black"></td>
  </tr>
  <tr> 
	<td  colspan ="7" height="1" bgcolor="black"></td>
  </tr>
  <tr> 
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center" height="30">cell 31</td>
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center">cell 32</td>
	<td width="1" bgcolor="black"></td>
	<td width="100" align="center">cell 33</td>
	<td width="1" bgcolor="black"></td>
  </tr>
  <tr> 
	<td  colspan ="7" height="1" bgcolor="black"></td>
  </tr>
</table>
</body>
</html>
    Paul
  4. Sep 13, 2004, 20:45 #4
    dotJoon
    dotJoon is offline
    Get my greedy down dotJoon's Avatar
    Join Date
    Apr 2003
    Location
    daejeon, South Korea
    Posts
    2,184
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B
    Same why ?
    For understanding style...

    Thank you for your example code.

    It helped a lot.

« Previous Thread | Next Thread »

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Forum Rules