Welcome to WebmasterWorld Guest from 3.80.4.76

Forum Moderators: mack

Message Too Old, No Replies

Navigation and aligning tables.

How do you align a table to the right of a navigation menu? Please help:)

     
9:43 am on Apr 26, 2005 (gmt 0)

Full Member

10+ Year Member

joined:May 3, 2004
posts:316
votes: 0


Hi everyone:)

Need some help aligning some information on a webpage.

I have navigation at the top left of the webpage.

Ex.

>Home
>Product >abc here< >xyz here<
>Order
>Info
>Faq
>Etc.
>Etc.
>Etc.

And i want to create 2 separate tables with some text and align them both to the right of the navigation menu as it is shown above.

I am having trouble aligning the text to the right of the menu.

I have:

<table width=100% border=0 cellpadding=0 cellspacing=0>
<td valign=top>
<tr>
<td>

blah blah
etc., etc.
</td>
</table>

*I've been trying to figure out what i'm doing wrong but have'nt been able to get it right. I am somewhat new to html so I have'nt used tables too much.

Q.1. What am i doing wrong?
Q.2. Can someone show me how to do this using the above example?

Q.3. I have seen people *not* use quotations in the source code. For example:

<table width=100% border=0>

Q. Do you need to *include* the quotations?
Ex. <table width="100%" border="0">

I think i've seen some use the quotes in their coding.

[edited by: Brett_Tabke at 1:55 pm (utc) on April 30, 2005]
[edit reason] no extended signature files please. [/edit]

3:46 pm on Apr 26, 2005 (gmt 0)

Full Member

10+ Year Member

joined:June 16, 2004
posts:249
votes: 0


Lots of ways to do this - if you're using a table for your entire page layout then something like this would work:

<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td> navigation goes here </td>
<td> 1st col of text goes here </td>
<td> 2nd col of text goes here </td>
</tr>
</table>

This will give you 3 cells side-by-side with the navigation on the far left. Set your td widths to appropriate values. And the td's need to go inside each <tr></tr> (your example has them mixed up)

Or you could do this with divs instead of tables, but that's another subject...

Q. Do you need to *include* the quotations?
Ex. <table width="100%" border="0">

You should.

Hope this helps!

5:30 pm on Apr 27, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:Oct 11, 2004
posts:75
votes: 0


In addition to MamDawg's technique you could use one large, page wide table and nest the other tables within the cells of the larger table...

<table width="100%" border="1">
<tr>

<td>
<table>
<tr><td>Menu Item 1</td></tr>
<tr><td>Menu Item 2</td></tr>
<tr><td>Menu Item 3</td></tr>
</table>
</td>

<td>
<table>
<tr><td>
Text Column 1
</td></tr>
</table>
</td>

<td>
<table>
<tr><td>
Text Column 2
</td></tr>
</table>
</td>

</tr>
</table>

Notice the large table has only one row. Also, the nested tables reside within the <td></td> tags (the cells) of the larger table.

The nice thing about this method is that you can assign differnet values for cellspacing and, what I often find especially helpful, cellpadding (as well as all other table variables) for each table.

[edited by: mt_biker at 5:45 pm (utc) on April 27, 2005]

5:44 pm on Apr 27, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:Oct 11, 2004
posts:75
votes: 0


Just noticed this from your example...

<table width=100% border=0 cellpadding=0 cellspacing=0>
<td valign=top>
<tr>
<td>

blah blah
etc., etc.
</td>
</table>

...the first <td> tag in preceeding the <tr> tag. <tr> needs to come first. Like this...

<table width=100% border=0 cellpadding=0 cellspacing=0>
<tr>
<td valign=top>

blah blah
etc., etc.
</td>
</tr>
</table>

 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members