Solved

Table Positioning

Posted on 2002-05-24
5
177 Views
Last Modified: 2010-04-09
I have a table
<table align="left"> so that the next table positions along side it.
I then want another table below. So all in all I have
<table align="left"></table>
<table></table>
<table></table>
i.e. two tables side by side plus one below.
A small problem arises, there is a slight gap between the two side by side tables.
This disappears if I add another table by using
<table align="left"></table>
<table align="left"></table>
<table></table>
<table></table>.
How can I get rid of the gap without having to add the extra align="left" and extra table please?
Thanks.
0
Comment
Question by:BlueFin
5 Comments
 
LVL 33

Accepted Solution

by:
knightEknight earned 50 total points
Comment Utility
you could put the top two tables in a seperate table will 0 cellpadding/spacing:


<TABLE border='0' cellpadding='0' cellspacing='0'>
<TR><TD>

   <table border='1' align="left">
      <tr><td>&nbsp;</td></tr>
   </table>

</TD>
<TD>

   <table border='1'>
      <tr><td>&nbsp;</td></tr>
   </table>

</TD></TR>
</TABLE>
0
 
LVL 2

Expert Comment

by:Marianne
Comment Utility
What's wrong about the second align=left ? It's the right approach.
0
 
LVL 2

Expert Comment

by:CompuTurk
Comment Utility
I would use Cells instead of tables in your case, but you can arrange your tables with the cells of a parenting table.

Here it is:

<table cellspacing="0" cellpadding="0" border="0" style="border-collapse: collapse">
  <tr>
    <td>
    <table border="0" cellpadding="0" cellspacing="0" width="100%">
      <tr>
        <td width="100%">&nbsp;</td>
      </tr>
    </table>
    </td>
    <td>
    <table border="0" cellpadding="0" cellspacing="0" width="100%">
      <tr>
        <td width="100%">&nbsp;</td>
      </tr>
    </table>
    </td>
  </tr>
  <tr>
    <td colspan="2">
    <table border="0" cellpadding="0" cellspacing="0" width="100%">
      <tr>
        <td width="100%">&nbsp;</td>
      </tr>
    </table>
    </td>
  </tr>
</table>

Good luck...
-CompuTurk
0
 
LVL 2

Expert Comment

by:jpoesen
Comment Utility
how about this :

<table style="display:inline;float:left">
...
</table>
<table style="display:inline;float:right">
...
</table>

Good luck
jpoesen
0
 

Author Comment

by:BlueFin
Comment Utility
Thanks NightEnight.
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Zoom web page in asp.net 2 34
Left menu with a header image 6 33
html select on change 3 25
Fixing my modal from bootstrap 14 0
Things That Drive Us Nuts Have you noticed the use of the reCaptcha feature at EE and other web sites?  It wants you to read and retype something that looks like this.Insanity!  It's not EE's fault - that's just the way reCaptcha works.  But it is …
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

7 Experts available now in Live!

Get 1:1 Help Now