Question

我的页面上有两个表格，它们并排显示。我想对齐两个表的顶部。怎么做？

编辑：

<body>
    <table id="main" cols="2">
    <tr>    
    <td>
    <Form id="frmNewEntry" method="post" action="insert_listing.php">
        <table id="tblEntry" cols="3" style="border-color:lightblue; border-style:solid;">
            <tr><td colspan="3" bgcolor="lightblue" align="center"><strong>Real-Time Vacancy Entry</strong></td></tr>
            <tr><td>Date:</td><td><input id="LDate" name="LDate" type="text" size="20" maxlength="11"/>[Select Date from the Calendar Control]
                <script type="text/javascript">
                    calendar.set("LDate");
                </script></td>
                <td>
                    <table>
                        <tr>
                            <td rowspan="6">
                            <!--    <iframe src="show_db_vacancy_entries.php" height="800px" width="300px" bordercolor="cyan">

                                </iframe> -->
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr><td>Places:</td><td><input id="Places" name="Places" type="text" size="35" maxlength="30" onblur="this.value=MakeInitialCapital(this.value);"></td></tr>
            <tr><td>Company:</td><td><input id="Company" name="Company" type="text" size="50" onblur="this.value=MakeInitialCapital(this.value);">
            <!--    <input type="button" value="Make Initial Capital" align="left" onclick="this.value=MakeInitialCapital(this.value);"></tr> -->
            <tr><td>Designation:</td><td><input id="Designation" name="Designation" type="text" size="50" onblur="this.value=MakeInitialCapital(this.value);"></td></tr>
            <tr><td>Project Details:</td><td><textarea id="ProjectDetails" name="ProjectDetails" cols="100" rows="10"></textarea></td></tr>
            <tr><td>Desired Candidate:</td><td><textarea id="DesiredCandidate" name="DesiredCandidate" rows="3" cols="100"></textarea> <br></td></tr>
            <tr><td>HR Name:</td><td><input id="HRName" name="HRName" type="text" size="50" onblur="this.value=MakeInitialCapital(this.value);"> <br></td></tr>
            <tr><td>HR Contact:</td><td><input id="HRContact" name="HRContact" type="text" size="50"> <br></td></tr>
            <tr><td>Email:</td><td><input id="Email" name="Email" type="text" size="50"> <br></td></tr>
            <tr></tr>
            <tr>
                <td  bgcolor="lightblue">
                    <input id="Submit" name="Submit" value="Clear" type="button">
                </td> 
                <td bgcolor="lightblue">
                    <input id="Submit" name="Submit" value="Submit" type="button">
                </td>
            </tr>

        </table>
    </Form>
    </td>
    <td>
        <table id="list" cols="2" style="border:none">
            <tr>
                <td colspan="2" style="border:none">
                    <iframe src="show_db_vacancy_entries.php" height="800px" style="border:none;">

                    </iframe>
                </td>
            </tr>
            <tr>
                <td align="left">
                    <input id="Update" name="Update" value="Update" type="button">
                </td>
                <td align="right">
                    <input id="Delete" name="Delete" value="Delete" type="button">
                </td>                   
            </tr>
        </table>
    </td>
    </tr>
    </table>
</body>

Answer 1

据我所知，您应该使用：

<table id="table 1">
  <tr>
    <td valign="top">....<td>
  </tr>
</table>

<table id="table 2">
  <tr>
    <td valign="top">....<td>
  </tr>
</table>

Answer 2

试试这个

 <div>
    <table id="tbl1" style="float:left"></table>
    <table id="tbl2" style="float:left"></table>
 </div>

对齐两个表的顶部

2 个答案: