html side by side tables

I need to have two tables  on same level with approx 10 spaces between them...  each table will contain 2 rows 2 columns
gingerginAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

minichickenCommented:
<table width="100%"  border="0" cellspacing="10" cellpadding="0">
  <tr>
    <td width="50%"><table width="100%"  border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table></td>
    <td width="50%"><table width="100%"  border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table></td>
  </tr>
</table>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
gingerginAuthor Commented:
Thank you very much for your help..    I appreciate it.   I am learning tables and this is a big help.
0
minichickenCommented:
No Prob....
Was that what you looking for??
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

Adesso21Commented:
What minichicken gave you will work but...

Nested tables as we call them is not the best way of learing tables.. Than means a table that contains a table. This should be avoided as best possible and only be used as a last resort..

What would be a better solution :

<table width="45%" border="1" cellpadding="2" cellspacing="2" align="left">
<tr>
      <td>1</td>
      <td>2</td>
</tr>
<tr>
      <td>5</td>
      <td>6</td>
</tr>
</table>
<table width="45%" border="1" cellpadding="2" cellspacing="2" align="right">
<tr>
      <td>3</td>
      <td>4</td>
</tr>
<tr>
      <td>7</td>
      <td>8</td>
</tr>
</table>

If you want to make the tables more exact then you might want to look at CSS and wrapping them in DIV tags or something..
but to answer your question the above code should do the trick..

Good Luck
Adesso21
0
seanpowellCommented:
I agree - I would not use nested tables.

Also, align="right" and align="left" have been deprecated from the specification, CSS is really the most standards compliant method for handling the float, and you only specify it in one table:

<table style="width:300px;">
  <tr>
    <td>Data</td>
    <td>Data</td>
  </tr>
</table>

<table style="width:300px; margin-left:10px; float:right;">
  <tr>
    <td>Data</td>
    <td>Data</td>
  </tr>
</table>

THanks,
Sean
0
Havin_itCommented:
Though if the window is narrowed to less than 600px, the tables will stack vertically. If important to avoid that, use percentage widths.
0
seanpowellCommented:
That was just an example - it really has nothing to do with the solution :-)
0
COBOLdinosaurCommented:
>>>I am learning tables.

If you are using these tables manage layout then you have made your first HUGE mistake.  That is not what they are for.  If you are using them for data presentation, there should never be a need to nest them, and nesting is the worst possible direction to start out in.

If you are just learning tables.  I suggest you spend some time learning CSS for layout, so you don't end up producing web page that look like some of the monstrosities that are a legacy of the 20th century absence of good CSS support.

Cd&
0
cLFlaVACommented:
Cd&

For the amount of times you tell people this, may I suggest storing a canned response in, say, a text document?  Copy & paste will save you some time.

:)
0
COBOLdinosaurCommented:
Each user is an individual.  Finding the right words for each of them, lets me connect with them and REALLY help often enough, that the extra effort is worth it.  Besides I need the typing practice. :^)

Cd&
0
Havin_itCommented:
Hear hear. Nothing wrong with trying to be an arbiter of good practice, especially with the young and impressionable (no offense intended to gingergin).

Though, just for the sake of being pedantic, gingergin hasn't specified what will be in his tables so let's not jump to the conclusion that it's just a layout mash.

PS, Cd&: I know this flies in the face of the teachings of Sir Tim, but nesting can be indispensable in dynamic data presentation (such as the intranet accounting app I'm currently bodging...). sometimes rows need to sub-divide, and I would, for example, need to replicate a recordset infinite times if I didn't use nesting.
0
COBOLdinosaurCommented:
That is what fieldsets are for.  However if you are working with accounting data, it is probably the kind of tabular data that tables are designed for. Most of what I work with is financial and statistical Intranet apps.  That uses a lot of datagrids; also large numbers of fieldsets, and when nesting is necessary the fieldsets are a better choice because they are easier to maintain and far more dynamic than cells in a complex table structure.

A small bit of fieldset usage here:

http://cd-articles.fateback.com/Formsin4.html

Cd&
0
seanpowellCommented:
This was posted as a member comment. I'm posting it here gingergin so others can read it.

two side by side tables....     each table will contain two rows and two columns.    One table will sit to the left of the center and one table will sit to the right of the table.  I need approx one inch of space between the two tables.   Each table will contain two photographs and data pertaining to the person.     Using nesting I cannot get the tables to appear totally separated and untouching on the page.   This was my goal and I regret I was not clear enough on my original request.  Thank you for the additional help.


gingerin - please post the code that you have now, then we can stop guessing and give you some specific options.

Thanks,
Sean
0
dileedilCommented:
This is the simple way

<table width="100%"  border="0" cellspacing="10" cellpadding="0">
       
         <tr>
                    <td width="50%" >
                                <table width="100%"  border="0" cellspacing="3" cellpadding="0">
                                                 <tr>
                                                               <td>
                                                                         Left - Top
                                                               </td>
                                                  </tr>
                                                  <tr>
                                                               <td>
                                                                          Left - Bottom
                                                               </td>
                                                  </tr>
                                 <table>
                     </td>
                     <td width="50%" >
                                <table width="100%"  border="0" cellspacing="3" cellpadding="0">
                                                 <tr>
                                                               <td>
                                                                          Right - Top
                                                               </td>
                                                  </tr>
                                                  <tr>
                                                               <td>
                                                                          Right - Bottom
                                                               </td>
                                                  </tr>
                                 <table>
                     </td>
         <tr>

</table>
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.