Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jul 2013
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Image Table Alignment Help

    Hey All,

    I have an issue in my JavaScript where I cant get two tables on the same line to align correctly. I need the first table (symbol/meaning table) aligned to the left and the second table (image logo.gif table) on the same line to align to the center. Right now everything is off centered to the left with the first table to the way way left. Here is my code maybe someone here can help me out because the other forums couldn't. I'll post a pic of what it looks like now.

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <meta http-equiv="refresh" content="60">
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Expires" CONTENT="-1">
    <title>[DashboardDescrip]</title>
    <style type="text/css">
    body
    {
    background-image: url('../Images/BackGround.gif');
    background-repeat: repeat;
    }
    </style>
    </head>

    <script type="text/javascript">
    var time = null
    function move() { window.location = window.location.href }
    </script>

    <STYLE type="text/css">
    #Nav a{ position:relative; display:block; text-decoration: none; color:black; }
    Body td{font-Family: Arial; font-size: 12px; }
    </style>

    <Table>

    <td width="23%" bordercolorlight="#FFFFFF" bordercolordark="#808080" align="left" valign="top">
    <TABLE BORDER=2 width="12%" align="left" id="BodyTable" height="20" cellspacing="0" cellpadding="0" bordercolor="#000000">
    <TR> <TH>Symbol</TH> <TH>Meaning</TH> </TR>
    <TR> <TD align="center"><img src='../Images/Not-ScheduledMain2.png' width='20' height='22' align='center'></TD> <TD align="center"><b>No Schedule</TD> </TR>
    <TR> <TD align="center"><img src='../Images/Gray-Astris2.png' width='20' height='22' align='center'></TD> <TD align="center"><b>Deactivated Tanks</TD> </TR>
    <TR> <TD align="center"> <img src='../Images/BlueTest2.png' width='20' height='22' align='center'></TD> <TD align="center"><b>Test Scheduled</TD> </TR>
    <TR> <TD align="center"><img src='../Images/GreenTest2.png' width='20' height='22' align='center'></TD> <TD align="center"><b>Test In Process</TD> </TR>
    <TR> <TD align="center"> <img src='../Images/RedTest2.png' width='20' height='22' align='center'></TD> <TD align="center"><b>Test Late</TD> </TR>
    <tr>
    </TABLE>
    <Table>
    <body bgcolor="#FFFFFF" link="#003399" vlink="#003399" alink="#003399" style="margin: 20px 0px 0px 0px" onload="timer=setTimeout('move()',[Refresh]000)">
    <div align="center">
    <table border="0" width="800" id="Nav" cellpadding="0" cellspacing="0" valign="top" >
    <tr>
    <td height="60" width="100%"><p align="center"><img border="0" src="../Images/Logo.jpg" width="199" height="101"></td>



    </tr>
    <tr>
    <td width="100%" bordercolorlight="#FFFFFF" bordercolordark="#808080" align="center" valign="top">
    <table border="0" width="100%" id="HeaderTable" cellspacing="0" cellpadding="0" valign="top" height="73">
    <tr>
    <td colspan="3" height="34"><p align="center"><b><font face="Arial" size="5">IEC's TrueLogic Dashboard</font></b></td>
    </tr>
    <tr>
    <td colspan="3" height="39"><p align="center">
    </td>
    </tr>
    </table>
    </td>
    </tr>
    <tr>
    <td height="340" width="110%" bordercolorlight="#FFFFFF" bordercolordark="#808080" align="center" valign="top">
    <table border="0" width="100%" id="BodyTable" height="20" cellspacing="0" cellpadding="0" bordercolor="#FFFFFF">
    <tr>
    <td height='20' width='20' bgcolor="#C0C0C0" ><p align='center'> </td>
    <td width='14'> <td>
    <td height='20' width='360' bgcolor="#C0C0C0" ><p align='center'><a><b>Process Line</b></td>
    <!-- Sample Item Removed <td height='10' width='120' bgcolor="#C0C0C0" ><p align='center'><a><b>Sample</b></td>
    --> <td width='14'> <td>
    <td height='20' width='120' bgcolor="#C0C0C0" ><p align='center'><a><b>Test Status</b></td>
    <td width='14'> <td>
    <td height='20' width='120' bgcolor="#C0C0C0" ><p align='center'><a><b>Adds</b></td>
    <td width='14'> <td>
    <td height='20' width='120' bgcolor="#C0C0C0" ><p align='center'><a><b>Corrective Action</b></td>
    </tr>
    </Table>
    <table border="0" width="100%" id="BodyTable" height="37" cellspacing="0" cellpadding="0" valign="top">
    <script type="text/javascript">[ItemsHTML]
    </script>
    </table>
    </td>
    </tr>
    <tr>
    <td HEIGHT="25"></td>
    </tr>

    <tr>
    <td height="25">
    <table border="0" width="100%" cellspacing="0" cellpadding="0" id="table1">
    <tr>
    </tr>
    <td width="335"><p align="left"><font size="1"> <p> By TrueLogic Company <p> Edited By International Electronic Components</font></td>
    <td width="290"><p align="center"></td>
    <td width="135"><p align="right"><font size="1">[LastBuild]</font></td>
    </tr>
    </table>
    </td>
    </tr>
    <tr>
    <td HEIGHT="25"></td>
    </td>
    </tr>
    </table>
    </div>
    </body>
    </html>
    Attached Thumbnails Attached Thumbnails Image Table Alignment Help-capture6.jpg  

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,631
    Thanks
    0
    Thanked 649 Times in 639 Posts
    The first step would be to get rid of the tables and all the antiquated HTML 3.2 tags. It will be much easier to get the alignments you want once you upgrade to the new version of HTML that was introduced in 1997 - HTML 4.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    chrisw.iec (07-14-2013)

  • #3
    New to the CF scene
    Join Date
    Jul 2013
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I'd love to do that however my knowledge of writing HTML or anything script is two weeks old, I inherited this and made a ton of changes to the first part of code I didn't post. Now to finish I just need to align the Legend(meaning/symbol table) with the table with an image of logo.gif in it. I worked for two weeks straight 10 12 hours a day and the only thing I cant figure out is the stupid alignment.

  • #4
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,631
    Thanks
    0
    Thanked 649 Times in 639 Posts
    It will be far quicker to throw all that HTML away and start over than to try to fix the remaining problems in such a horrible mess of meaningless tags as you currently have. Particularly since that code will likely be interpreted differently in different browsers and not display the way you want on many devices even if you do eventually get it to work in one browser.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #5
    New to the CF scene
    Join Date
    Jul 2013
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts
    So once again, I don't write any code I can barely edit the javascript, which took me weeks btw. I don't need it to work in anything other than IE because it is not a webpage, it is a dashboard for an analytical software that databases chemical analysis inputs. So there is absolutely no way I can ever I get those to tables to align on the same line, at the top, one aligned left and one aligned in the center? Do you know any freelancers I can pay to translate to a newer language and align what I want? There's no way I can do it, like I said I don't write it I can edit some of it.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •