tables are not aligned to the correct line

Discussion in 'HTML' started by jic, Jan 28, 2010.

  1. jic

    jic Guest

    If you take this code and save it to test.htm and open it with IE, you
    will see that the takes are not aligned properly. What should
    happened is that the tables should aligned like this:

    ________ ________
    | | | |
    |_______| |________|

    ________________
    | |
    |________________|
    ________________
    | |
    |________________|

    but it is displaing like this,

    ________ ________
    | | | |
    |_______| |________| ________________
    | |
    |________________|


    Any help would be greatly appreciated. Here is the code...

    <!doctype html public>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>title</title>
    <style type="text/css">
    body {text-align: left; font-family: tahoma;
    font-size:9pt; background-color:lightblue}
    </style>
    </head>
    <body>
    <table border="1" align="right" style="font-size:12px; background-
    color:"ddffdd">
    <td align="right">Some String1<br>
    Some string2 (BLAH)<br>
    <img
    height="60%"
    width="60%"
    align="right"
    src="../../../../Logo.jpg"
    alt="ALT String"
    title="title TITLE"
    border="0" />
    </td>
    <td align="right">Some string3<br><b>Name</b><br><b>Phone:</b> ###-
    ###-####<br><b>String:</b> #*###-###<br><b>Fax:</b> ###-###-
    ####<br><b></b></td>
    </table>
    <table cellpadding="3" border="1" bordercolor=darkdarkblue
    align="left"
    style="font-size:12px; background-color:"ddffdd">
    <tr><th colspan="2"> <center>Quotation</center> </th></
    tr><tr align="left"><td>Quote Reference</td><td>String</td></tr><tr
    align="left"><td>Customer Contact</td><td>String</td></tr><tr
    align="left"><td>Number</td><td>-</td></tr><tr align="left"><td>Date</
    td><td>Wed Jan 27, 2010 22:58:44</td></tr>
    </table>
    <br><br><p><br><br><br><br><br><p>
    <table width=100% cellpadding="3" border="1" bordercolor=darkblue
    align="left"
    style="font-size:12px;" background-color:"ddffdd">
    <tr><th colspan="0"> <center>Notes and Assumptions</center>
    </th></tr>
    <tr align="center"></b></tr><tr align="left"><td>lots of strings</
    td></tr>
    <tr align="left"><td><b>blah1<b></td></tr>
    <tr align="left"><td>blah2</td></tr>
    <tr align="left"><td>blah3</td></tr>
    </table>
    <p><p><br><br>
    <table width=100% cellpadding="3" border="1" bordercolor=darkblue
    align="left"
    style="font-size:12px;" background-color:"ddffdd">
    <tr><th colspan="8"> <center>Quote Summary</center> </th></
    tr>
    <tr align="center"><td width=12%><b>Deliverables</b></td>
    <td width=12%><b>German - Germany</b></td>
    <td width=12%><b>Spanish - International</b></td>
    <td width=12%><b>French - International</b></td>
    <td width=12%><b>Italian - Italy</b></td>
    <td width=12%><b>Dutch - Netherlands</b></td>
    <td width=12%><b>Portuguese - Brazil</b></td>
    <td width=12%><b>Total</b></td></b></tr><tr>
    <td width=12% align="left">Strings and strings</td>
    <td width=12% align="right">10.00</td>
    <td width=12% align="right">10.00</td>
    <td width=12% align="right">10.00</td>
    <td width=12% align="right">10.00</td>
    <td width=12% align="right">10.00</td>
    <td width=12% align="right">10.00</td>
    <td width=12% align="right">10.00</td></tr>

    </table>
    <br><br><br><br><br><br><br><br><br>
    <table width=100% cellpadding="3" border="1" bordercolor=darkblue
    align="left"
    style="font-size:12px;" background-color:"ddffdd">
    <tr><th colspan="8"> <center>Quote Details</center> </th></
    tr><tr align="center"><td width=12%><b>Details</b></td><td
    width=12%><b>German - Germany</b></td><td width=12%><b>Spanish -
    International</b></td><td width=12%><b>French - International</b></
    td><td width=12%><b>Italian - Italy</b></td><td width=12%><b>Dutch -
    Netherlands</b></td><td width=12%><b>Portuguese - Brazil</b></td><td
    width=12%><b>Total</b></td></b></tr><tr><td align="left"><b>File-Proc</
    b></td><td align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right"><b>10.00</b></td></tr>
    <tr><td align="left"><b>DOC-Trans</b></td><td align="right">10.00</
    td><td align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right"><b>10.00</b></td></tr>
    <tr><td align="left"><b>Validation</b></td><td align="right">10.00</
    td><td align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right"><b>10.00</b></td></tr>
    <tr><td align="left"><b>DTP</b></td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right"><b>10.00</b></td></tr>
    <tr><td align="left"><b>PM</b> 10% of total</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right">10.00</td><td align="right">10.00</td><td
    align="right"><b>10.00</b></td></tr>
    <tr><td align="left">Total</td><td align="right"><b>10.00</b></td><td
    align="right"><b>10.00</b></td><td align="right"><b>10.00</b></td><td
    align="right"><b>10.00</b></td><td align="right"><b>10.00</b></td><td
    align="right"><b>10.00</b></td><td align="right"><b>10.00</b></td></
    tr>

    </table>
    <p><p><p><p><p><p><p><p><p><!-- end --><br><br>
    </body>
    </html>
    jic, Jan 28, 2010
    #1
    1. Advertising

  2. jic

    jic Guest

    Sorry guys, the drawings should have displayed like this:
    ________ ________
    | | | |
    |_______| |________|

    ________________
    | |
    |________________|
    ________________
    | |
    |________________|

    but it is displaying like this,

    _______ ________
    | | | |
    |_______| |________| ________________
    | |
    |________________|


    On Jan 28, 12:17 am, jic <> wrote:
    > If you take this code and save it to test.htm and open it with IE, you
    > will see that the takes are not aligned properly.  What should
    > happened is that the tables should aligned like this:
    >
    > ________  ________
    > |            |  |              |
    > |_______|  |________|
    >
    > ________________
    > |                            |
    > |________________|
    > ________________
    > |                            |
    > |________________|
    >
    > but it is displaing like this,
    >
    > ________  ________
    > |            |  |              |
    > |_______|  |________| ________________
    >                                 |                            |
    >                                 |________________|
    >
    > Any help would be greatly appreciated.  Here is the code...
    >
    > <!doctype html public>
    >   <head>
    >   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    >   <title>title</title>
    >   <style type="text/css">
    >   body {text-align: left; font-family: tahoma;
    >   font-size:9pt; background-color:lightblue}
    >   </style>
    >   </head>
    >   <body>
    >   <table border="1" align="right" style="font-size:12px; background-
    > color:"ddffdd">
    >     <td align="right">Some String1<br>
    >     Some string2 (BLAH)<br>
    >                       <img
    >                         height="60%"
    >                         width="60%"
    >                         align="right"
    >                         src="../../../../Logo.jpg"
    >                         alt="ALT String"
    >                         title="title TITLE"
    >                         border="0" />
    >     </td>
    >     <td align="right">Some string3<br><b>Name</b><br><b>Phone:</b> ###-
    > ###-####<br><b>String:</b> #*###-###<br><b>Fax:</b> ###-###-
    > ####<br><b></b></td>
    >   </table>
    >     <table cellpadding="3" border="1" bordercolor=darkdarkblue
    > align="left"
    >      style="font-size:12px; background-color:"ddffdd">
    >      <tr><th colspan="2">    <center>Quotation</center>    </th></
    > tr><tr align="left"><td>Quote Reference</td><td>String</td></tr><tr
    > align="left"><td>Customer Contact</td><td>String</td></tr><tr
    > align="left"><td>Number</td><td>-</td></tr><tr align="left"><td>Date</
    > td><td>Wed Jan 27, 2010 22:58:44</td></tr>
    >     </table>
    > <br><br><p><br><br><br><br><br><p>
    >     <table width=100% cellpadding="3" border="1" bordercolor=darkblue
    > align="left"
    >      style="font-size:12px;" background-color:"ddffdd">
    >      <tr><th colspan="0">    <center>Notes and Assumptions</center>
    > </th></tr>
    >      <tr align="center"></b></tr><tr align="left"><td>lots of strings</
    > td></tr>
    >      <tr align="left"><td><b>blah1<b></td></tr>
    >      <tr align="left"><td>blah2</td></tr>
    >      <tr align="left"><td>blah3</td></tr>
    >     </table>
    > <p><p><br><br>
    >     <table width=100% cellpadding="3" border="1" bordercolor=darkblue
    > align="left"
    >      style="font-size:12px;" background-color:"ddffdd">
    >      <tr><th colspan="8">    <center>Quote Summary</center>    </th></
    > tr>
    >      <tr align="center"><td width=12%><b>Deliverables</b></td>
    >      <td width=12%><b>German - Germany</b></td>
    >      <td width=12%><b>Spanish - International</b></td>
    >      <td width=12%><b>French - International</b></td>
    >      <td width=12%><b>Italian - Italy</b></td>
    >      <td width=12%><b>Dutch - Netherlands</b></td>
    >      <td width=12%><b>Portuguese - Brazil</b></td>
    >      <td width=12%><b>Total</b></td></b></tr><tr>
    >      <td width=12% align="left">Strings and strings</td>
    >      <td width=12% align="right">10.00</td>
    >      <td width=12% align="right">10.00</td>
    >      <td width=12% align="right">10.00</td>
    >      <td width=12% align="right">10.00</td>
    >      <td width=12% align="right">10.00</td>
    >      <td width=12% align="right">10.00</td>
    >      <td width=12% align="right">10.00</td></tr>
    >
    >     </table>
    > <br><br><br><br><br><br><br><br><br>
    >     <table width=100% cellpadding="3" border="1" bordercolor=darkblue
    > align="left"
    >      style="font-size:12px;" background-color:"ddffdd">
    >      <tr><th colspan="8">    <center>Quote Details</center>    </th></
    > tr><tr align="center"><td width=12%><b>Details</b></td><td
    > width=12%><b>German - Germany</b></td><td width=12%><b>Spanish -
    > International</b></td><td width=12%><b>French - International</b></
    > td><td width=12%><b>Italian - Italy</b></td><td width=12%><b>Dutch -
    > Netherlands</b></td><td width=12%><b>Portuguese - Brazil</b></td><td
    > width=12%><b>Total</b></td></b></tr><tr><td align="left"><b>File-Proc</
    > b></td><td align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right"><b>10.00</b></td></tr>
    > <tr><td align="left"><b>DOC-Trans</b></td><td align="right">10.00</
    > td><td align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right"><b>10.00</b></td></tr>
    > <tr><td align="left"><b>Validation</b></td><td align="right">10.00</
    > td><td align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right"><b>10.00</b></td></tr>
    > <tr><td align="left"><b>DTP</b></td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right"><b>10.00</b></td></tr>
    > <tr><td align="left"><b>PM</b> 10% of total</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right">10.00</td><td align="right">10.00</td><td
    > align="right"><b>10.00</b></td></tr>
    > <tr><td align="left">Total</td><td align="right"><b>10.00</b></td><td
    > align="right"><b>10.00</b></td><td align="right"><b>10.00</b></td><td
    > align="right"><b>10.00</b></td><td align="right"><b>10.00</b></td><td
    > align="right"><b>10.00</b></td><td align="right"><b>10.00</b></td></
    > tr>
    >
    >     </table>
    > <p><p><p><p><p><p><p><p><p><!-- end --><br><br>
    >     </body>
    >   </html>
    jic, Jan 28, 2010
    #2
    1. Advertising

  3. jic

    dorayme Guest

    In article
    <
    >,

    jic <> wrote:

    > If you take this code and save it to test.htm and open it with IE, you
    > will see that the takes are not aligned properly.


    [snip huge amount of mark up text}

    How about you taking it and putting it up on a server and giving
    just the URL here?

    --
    dorayme
    dorayme, Jan 28, 2010
    #3
  4. jic

    jic Guest

    On Jan 28, 1:03 am, dorayme <> wrote:
    > In article
    > <
    >
    > >,

    >  jic <> wrote:
    > > If you take this code and save it to test.htm and open it with IE, you
    > > will see that the takes are not aligned properly.

    >
    > [snip huge amount of mark up text}
    >
    > How about you taking it and putting it up on a server and giving
    > just the URL here?
    >
    > --
    > dorayme


    http://www.barrioinvi.net/sample.htm

    again, the idea is to be able to add horizontal spaces in between the
    tables. I am able to, but I have to add huge amounts of <br> and
    <p>. Also, browsers behave differently, but IE is the desired fix.

    thanks,

    josé
    jic, Jan 28, 2010
    #4
  5. jic

    C A Upsdell Guest

    On 2010-01-28 1:03, dorayme wrote:
    > In article
    > <
    >> ,

    > jic<> wrote:
    >
    >> If you take this code and save it to test.htm and open it with IE, you
    >> will see that the takes are not aligned properly.

    >
    > [snip huge amount of mark up text}
    >
    > How about you taking it and putting it up on a server and giving
    > just the URL here?


    But first, fix the HTML and/or CSS errors. (Just looking at the code I
    saw several obvious CSS errors, and one obvious HTML problem which may
    produce quite different results in different browsers.) And use a
    DOCTYPE which triggers Strict mode instead of Quirks mode, otherwise
    browsers are less likely to produce similar results. And tell us
    *which* version of IE.
    C A Upsdell, Jan 28, 2010
    #5
  6. jic

    dorayme Guest

    In article
    <
    >,

    jic <> wrote:

    > On Jan 28, 1:03 am, dorayme <> wrote:
    > > In article
    > > <
    > >
    > > >,

    > >  jic <> wrote:
    > > > If you take this code and save it to test.htm and open it with IE, you
    > > > will see that the takes are not aligned properly.

    > >
    > > [snip huge amount of mark up text}
    > >
    > > How about you taking it and putting it up on a server and giving
    > > just the URL here?
    > >
    > > --
    > > dorayme

    >
    > http://www.barrioinvi.net/sample.htm
    >
    > again, the idea is to be able to add horizontal spaces in between the
    > tables. I am able to, but I have to add huge amounts of <br> and
    > <p>. Also, browsers behave differently, but IE is the desired fix.
    >


    > thanks,


    > josé



    table {margin-bottom: 1em;} in your CSS sheet

    or

    <table style="margin-bottom: 1em">

    (You cook Spanish maybe? Or Portuguese?)

    --
    dorayme
    dorayme, Jan 28, 2010
    #6
  7. jic

    jic Guest

    On Jan 28, 1:18 am, C A Upsdell <> wrote:
    > On 2010-01-28 1:03, dorayme wrote:
    >
    > > In article
    > > <
    > >> ,

    > >   jic<>  wrote:

    >
    > >> If you take this code and save it to test.htm and open it with IE, you
    > >> will see that the takes are not aligned properly.

    >
    > > [snip huge amount of mark up text}

    >
    > > How about you taking it and putting it up on a server and giving
    > > just the URL here?

    >
    > But first, fix the HTML and/or CSS errors.  (Just looking at the code I
    > saw several obvious CSS errors, and one obvious HTML problem which may
    > produce quite different results in different browsers.)  And use a
    > DOCTYPE which triggers Strict mode instead of Quirks mode, otherwise
    > browsers are less likely to produce similar results.  And tell us
    > *which* version of IE.


    Do you mind pointing these out? I am not very familiar with HTML.
    This HTML program I create from another application written in D,
    which is used for reporting, but the tables are not aligning as I
    want.
    jic, Jan 28, 2010
    #7
  8. jic

    jic Guest

    On Jan 28, 1:29 am, dorayme <> wrote:
    > In article
    > <
    >
    >
    >
    > >,

    >  jic <> wrote:
    > > On Jan 28, 1:03 am, dorayme <> wrote:
    > > > In article
    > > > <

    >
    > > > >,
    > > >  jic <> wrote:
    > > > > If you take this code and save it to test.htm and open it with IE, you
    > > > > will see that the takes are not aligned properly.

    >
    > > > [snip huge amount of mark up text}

    >
    > > > How about you taking it and putting it up on a server and giving
    > > > just the URL here?

    >
    > > > --
    > > > dorayme

    >
    > >http://www.barrioinvi.net/sample.htm

    >
    > > again, the idea is to be able to add horizontal spaces in between the
    > > tables.  I am able to, but I have to add huge amounts of <br> and
    > > <p>.  Also, browsers behave differently, but IE is the desired fix.

    >
    > > thanks,
    > > josé

    >
    > table {margin-bottom: 1em;} in your CSS sheet


    The problem is that I want the two top ones just as they are. They
    should be on the top but one on the left and the other on the right.
    So, I don't want to do this for all of them.

    >
    > or
    >
    > <table style="margin-bottom: 1em">


    This one is not working.
    >
    > (You cook Spanish maybe? Or Portuguese?)


    Spanish. :)
    jic, Jan 28, 2010
    #8
  9. jic

    dorayme Guest

    In article
    <
    m>,
    jic <> wrote:

    > On Jan 28, 1:29 am, dorayme <> wrote:

    ....
    > > table {margin-bottom: 1em;} in your CSS sheet

    >
    > The problem is that I want the two top ones just as they are. They
    > should be on the top but one on the left and the other on the right.
    > So, I don't want to do this for all of them.
    >
    > >
    > > or
    > >
    > > <table style="margin-bottom: 1em">

    >
    > This one is not working.



    OK. I underestimated the task. I suggest you read the tutorial at:

    <http://htmldog.com/guides/htmlbeginner/>

    and especially that first page.

    --
    dorayme
    dorayme, Jan 28, 2010
    #9
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Dan

    correct or not correct?

    Dan, Oct 2, 2003, in forum: HTML
    Replies:
    7
    Views:
    441
  2. Eric
    Replies:
    10
    Views:
    562
  3. =?Utf-8?B?QmlzaG95?=
    Replies:
    0
    Views:
    986
    =?Utf-8?B?QmlzaG95?=
    Dec 28, 2006
  4. Cell Phone Repair

    pictures not aligned in the middle-newbie

    Cell Phone Repair, Nov 14, 2007, in forum: HTML
    Replies:
    1
    Views:
    386
  5. J.Ram
    Replies:
    7
    Views:
    650
Loading...

Share This Page