...

View Full Version : Table Spacing?



Blind Zero
10-14-2004, 05:17 AM
I am not exact on what this is called so it did me no good to look it up. But what I want to know is how do I make a little table inside of a larger table. You see websites with them all of the time, like DeviantART and Cubix, my question is how is it done?

I am wanting to have a basic set up for a new site I am working on, header, footer, content in the middle and on the right two little boxes. Boxes that can hold extra links and affiliates. They would have a space between them and the content of the page but I am not sure how to do this.

When I set up the table and think I have it right, the content area, when stretched vertically also stretches the two side tables vertically and it is frustrating.

I have a few examples of what I am talking about and evern a rough sketch of what I want the website to look like I'd that would help.

Here is an example from DeviantART.com...
http://img.photobucket.com/albums/v286/blindzero/Help/screenshot001.jpg

There is s space between the side menu and the content area, how would I obtain this effect and how would I keep the vertical stretching of the main content from stretching the side menus?

Here is another example from MYCubix
http://img.photobucket.com/albums/v286/blindzero/Help/screenshot002.jpg

How could I obtain this without interfering with the rest of the table(s)?

And finally a link to a poorly drawn and low quality sketch of what ia m roughly wanting. As you can see there are little menus on the right, how would I make those and not have them certically stretched by the content area?

Rough Sketch (http://img.photobucket.com/albums/v286/blindzero/Help/experimental.jpg)

I hope I explained myself well. lol

gohankid77
10-14-2004, 05:28 AM
You would use table nesting:


<table>
<tr>
<td>
<table>
<tr>
<td>(Begin the first table)</td>
..........
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>(Begin the second table)</td>
..........
</tr>
</table>
</td>
</tr>
</table>


That's for something like DeviantART where the tables are side by side.
To make them on top of each other, you would put them in separate tables:


<table>
<tr>
<td>(Begin the first table)</td>
..........
</tr>
</table>
<table>
<tr>
<td>(Begin the second table)</td>
..........
</tr>
</table>


or separate rows within the container table:


<table>
<tr>
<td>
<table>
<tr>
<td>(Begin the first table)</td>
..........
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>(Begin the second table)</td>
..........
</tr>
</table>
</td>
</tr>
</table>

Blind Zero
10-14-2004, 05:42 AM
Wow, thank you so much. Is there anything else you can explain to me, or would it be a good idea to search around for "table nesting" to get more information and tips.

I printed your post for reference. lol You have been extremely helpful to me. :)

gohankid77
10-14-2004, 05:48 AM
Well . . . . Table nesting can get pretty bad when you want to update a page and change the look of the table. It isn't very highly recommended, but it does have its uses. I rarely use tables, and I have never nested tables, so I don't really care much for them since CSS works better for me.

Blind Zero
10-14-2004, 05:53 AM
Well this is my first time ever needing anything like this and I am not good with CSS. lol

gohankid77
10-14-2004, 05:57 AM
Learn CSS during your free time and it'll be well worth it. It takes a while to figure out how certain properties interact with each other, but once you get it, it gets considerably easier. All you need is a basic reference, an advanced guide/reference, and a lot of experimentation. ;)

I'm glad I could help. Anytime you have a question that you can't solve after searching on the Web and in these forums, feel free to post.

Blind Zero
10-14-2004, 06:08 AM
Alright, I will definatly start looking into CSS more, can you suggest any good references?

gohankid77
10-14-2004, 06:19 AM
W3Schools CSS Tutorial (http://www.w3schools.com/CSS/default.asp) is a good start for a beginner.

The W3C CSS2.1 Candidate Recommendation (http://www.w3.org/TR/CSS21/) would be next (ideally). There is a lot at W3.org that the W3C explains in great TECHNICAL detail. In other words, you'll get a whole new vocabulary! You could probably find some more tutorials online.

/* PIE */ (http://www.positioniseverything.net/) is a good reference for browser hacks (you'll run into them quite often when coding for more than one browser). It also has some CSS tutorial links.

A List Apart (http://www.alistapart.com/) has some interesting and quite useful information.

That should keep you busy for a while!

Blind Zero
10-14-2004, 06:29 AM
I am sure it will, thank you for all of your help. :thumbsup:

ronaldb66
10-14-2004, 08:43 AM
Also check out the "HTML & CSS Documentation" sticky at the top of this forum.
If you like reading, nothing beats "Cascading Style Sheets: The Definitive Guide, Second Edition (http://www.meyerweb.com/eric/books/css-tdg/)" by Eric Meyer (http://www.meyerweb.com/).



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum