Here is the link (http://www.users.kconline.com/vicary/newfolder/sample.htm).

I want the tables side by side (all 3 of them) but I want some space between each of them. I want it set up like this site with lots of tables on one page.

Can someone help me?

Here is the link (http://members.kconline.com/vicary/js/) for the javascript...

It's not really that hard. Try something like this:

<table width=100%><tr><td width=33%>
**Put the first table here**
</td><td width=34%><center>
**Put the second table here**
</td><td width=33%><p align=right>
**Put the third table here**
</td></tr></table>

That's all there is to it.

worked with them and I still cannot get this code right:


<div style="position:absolute; top: 0; left: 0; overflow: auto; width: 100%;">

<table border="1" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td>

<!-- First TABLE -->
<table border="1" cellSpacing="2" cellPadding="2" width="33%" align="left">
<tr>
<td align="center" bgColor="#c0c0c0" width="33%">
<b>Greeting</b></font>
</td>
</tr>

<tr>
<td align="center" bgColor="#c0c0c0" width="33%">
Oh Boy aren't rollovers just fun?
</td>
</tr>

<tr>
<td align="center" bgColor="#c0c0c0" width="33%">
<a href="mailto:sales@vicarybiznis.com" target="_blank"></a>
a<br>
b<br>
c<br>
d<br>
e<br>
f<br>
g<br>
h<br>
i<br>
j<br>
</td>
</tr>
</table>

<!-- MIDDLE TABLE -->
<table border="1" cellSpacing="2" cellPadding="2" width="34%" align="center">
<tr>
<td align="center" bgColor="#c0c0c0" width="34%">
<b>Greeting</b></font></td>
</tr>

<tr>
<td align="center" bgColor="#c0c0c0" width="34%">
Oh Boy aren't rollovers just fun?
</td>
</tr>

<tr>
<td align="center" bgColor="#c0c0c0" width="34%">
<a href="mailto:sales@vicarybiznis.com" target="_blank"></a>
a<br>
b<br>
c<br>
d<br>
e<br>
f<br>
g<br>
h<br>
i<br>
j<br>
</td>
</tr>
</table>

<!-- LAST TABLE -->
<table border="1" cellSpacing="2" cellPadding="2" width="33%" align="right">
<tr>
<td align="center" bgColor="#c0c0c0" width="33%">
<b>Greeting</b></font></td>
</tr>

<tr>
<td align="center" bgColor="#c0c0c0" width="33%">
Oh Boy aren't rollovers just fun?
</td>
</tr>

<tr>
<td align="center" bgColor="#c0c0c0" width="33%">
<a href="mailto:sales@vicarybiznis.com" target="_blank"></a>
a<br>
b<br>
c<br>
d<br>
e<br>
f<br>
g<br>
h<br>
i<br>
j<br>
</td>
</tr>
</table>

</td>
</tr>
</table>
</div>


ANY HELP with the alignment and getting these 3 tables within the large table aligned side by side? Thanks.

Hey Vicary,

What are you using to write your code? There are still a lot of unnecessary components.

First, I would take out the div tags...then rather than nesting the tables, I would just make one table...kinda like so:

<table cellpadding="0" cellspacing="0" border="0" width="100%" align="center">

<tr>
<td align="left" valign="top" width="30%">Here is the Left Column</td>

<!--Here is your spacer image--><td align="left" valign="top" width="25"><img src="images/spacer.gif" width="20"></td>

<td align="left" valign="top" width="40%">Here is the Center Area</td>

<td align="left" valign="top" width="20"><img src="images/spacer.gif" width="20">

<td align="left" valign="top" width="30%">Here is the Right Column</td>

</tr>


</table>

The spacer.gif image is just a transparent gif 1 pixel by 1 pixel. If you don't have one...you can make one in PSP. The spacer image is measured in pixels here and not in percentages like the rest of the table. You could just as easily have altered the percentages and used a spacer image at 5%...or something like that.

This should give you the kind of table you are looking for. Just play around a bit with the percentages...and you should have it in no time.

Hope this helps.

Hugs,
Erica

Here's a link to the example code above. I colored the tables cells to make it more clear.

Table Example (3 columns) (http://www.txgraphics.net/test_table.htm)

to keep the look of my 3 tables as they are, just lined up beside each other. I want each row to have a border as such and well, here is the link (http://members.kconline.com/vicary/mystisite/metallic.html) so you can see what I mean. You can view the source code and see what I mean. I just cannot get that 3rd table up there beside the 2nd.

Here is the link (http://www.fire-cracker.org/) in which I really am fond of as for the tables and alignment of them. I only want 3 rows of table though as I noticed that her layout has 4 and I cannot view the 4 rows of tables on the right.

But that site is just an example of the tables I want.

Thank you for all your help today though! I really appreciate it!

Just add a style sheet defining how you want your table borders to look. For instance, just define a class for the title, then the body/content area. Each with a 1 pixel black border and perhaps a little cellpadding.

Her code seems to be all messed up...the site looks great in IE...but really awful in Netscape. And, if I were her...I would have used an external style sheet.

Book of Styles (http://www.bookofstyles.org/) has some really great tableless layouts that are similar to what you are looking for. But, if you use them...be sure to link back to Firda's site.

But, if it were me, I would define something similar to the following in an external stylesheet. Then just use the table I made above and div's to seperate the sections. Just like in a Blog (which is what her page appears to be).





body { font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}


.title {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
color: #000000;
background-color: #CCCCCC;
padding: 3px;
border: 1px solid #000000;
text-align: center;
margin-top: 2px;
margin-bottom: 2px;

}

.content {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
background-color: #999999;
text-align: justify;
padding: 3px;
border: 1px solid #000000;

}




CLICK HERE to see the Above Code in Action (http://www.txgraphics.net/test_table.htm)

Although...you may want to add a side margin...here I set the margins to 0 for the main body.

Is this more what you had in mind?

Hope this helps.

Hugs,
Erica

Couldn't help myself...here's that same code...with a few adjustments.

CODE LINK 2 (http://www.txgraphics.net/test_table2.htm)

I just love Pink.

Hugs,
Erica