...

View Full Version : Tables



masterofollies
06-04-2007, 02:50 AM
Hi, im having the worst problem with a table. Tables are my weak point. They are so confusing. Here is my messed up coding.


<table width="40%" style="border: solid 1px white" cellspacing="0" cellpadding="0">
<tr><td colspan="4" bgcolor="#ffffff"><center><b>Suggested Item Price</b></center></td></tr>
<tr><td><b>Name</b></td><td><b>Price</b></td></tr>
</table>

<table width="40%" style="border: solid 1px white" cellspacing="0" cellpadding="0">
<center><tr><td><b>Item 1</b><td>$1.00</td></tr></td>
</center>
</table>


And this is what i'd like for it to look like,
http://www.mobilesignfactory.net/tablepic.jpg

I hope to learn by this. Thanks everyone.

sdcomputerz
06-04-2007, 03:42 AM
Id suggest using css instead of tables.

VIPStephan
06-04-2007, 04:01 AM
CSS instead of tables? What kind of advice is that?


CSS doesnít replace tables. Itís there for giving them a style.
Tables are the perfect solution for this kind of content.


This might give you a start.



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
table {
width: 300px;
border-bottom: 1px solid black;
border-top: 1px solid black;
margin-top: 10px;
}
caption {border: 1px solid black;}
thead {}
thead th {margin-bottom: 10px;}
th {text-align: left;}
th + th {text-align: right;}
td + td {text-align: right;}
</style>
</head>

<body>
<table cellspacing="0" cellpadding="0" border="1" rules="groups">
<caption>Suggested Item Price</caption>
<thead>
<tr>
<th>Name</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Item 1 </td>
<td>$ 1.00 </td>
</tr>
<tr>
<td>Item 2 </td>
<td>$ 2.00 </td>
</tr>
<tr>
<td>Item 3 </td>
<td>$ 3.00 </td>
</tr>
</tbody>
</table>
</body>
</html>


Unfortunately itís not so easy to separate the sections visually (to work in all browsers at least). And note: I didnít optimize it for IE 6. Itís just a suggestion for you to build upon.

masterofollies
06-04-2007, 04:21 AM
Excellent, this looks like it would work. If I have any problems ill let you know. Thanks so much

I am going to play with it to learn how to do it.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum