2009-12-15 113 views
1

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

编辑:

<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> 
+1

你能提供的代码? – rahul 2009-12-15 07:45:43

回答

1

试试这个

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

请检查我的答案,如果它是正确的.. tnx – Treby 2009-12-15 07:56:51

2

至于我能理解你的问题:你应该使用:

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

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

但在哪里使用? – RKh 2009-12-15 07:53:20

+0

如果两张桌子并排堆放在第三张桌子内,这种方法就行得通。在这种情况下,valign属性将被添加到外部表格的单元格中。 – Anurag 2009-12-15 08:02:28

+0

将其添加到包含该表的单元格​​。结帐显示:表格单元格,以及float:left for css解决方案。 – Anurag 2009-12-15 08:06:26