Question

我想要两张桌子要在我网站标题底部的顶部对齐。如何将两个表对齐到顶部？目前，一个表位于左上角（正确的位置），另一个表位于页面的中心，但位于另一个表的下方。如何将表格提升为与其他表格一致？

Wesite at http://108.210.72.235/docs/
要么 Screen Shot

<TABLE CELLSPACING="0" COLS="4" BORDER="0" style="margin:65px 0px 0px 70px;">
    <COLGROUP SPAN="4" WIDTH="85"></COLGROUP>
    <TR>
        <TD BGCOLOR="#D7D7D7" style="font-family: DejaVu, serif;font-size: 150%;HEIGHT="18" ALIGN="LEFT"><A HREF="/docs" style="text-decoration: none;">Documents</A></TD>

    <TR>
        <TD BGCOLOR="#DD8D8"style="font-family: DejaVu, serif;font-size: 150%;HEIGHT="18" ALIGN="LEFT"><A HREF="/erm" style="text-decoration: none;">Erm?</A></TD>
        <TD ALIGN="LEFT"><BR></TD>
    <TR>
        <TD BGCOLOR="#D8D8D8"style="font-family: DejaVu, serif;font-size: 150%;HEIGHT="18" ALIGN="LEFT"><A HREF="/music" style="text-decoration: none;">Music</A></TD>
        <TD ALIGN="LEFT"><BR></TD>


</TABLE>
<TABLE VALIGN=CENTER ALIGN=CENTER>
<?php
 if ($handle = opendir('.')) {
   while (false !== ($file = readdir($handle)))
      {
          if ($file != "." && $file != "..")
      {
            $thelist .= '   <TR>
        <TD BGCOLOR="#D8D8D8" style="font-family: DejaVu, serif;font-size: 150%;HEIGHT="18" ALIGN="LEFT"><a href="'. $file.'">' .$file. '</a></TD>
        <TD ALIGN="LEFT"><BR></TD>';
          }
       }
  closedir($handle);
  }
?>
<P><?=$thelist?></p>
</TABLE>

Answer 1

将float:left添加到左侧表格的样式中。

<TABLE CELLSPACING="0" COLS="4" BORDER="0" style="margin:65px 0px 0px 70px;float:left">

Answer 2

表是块元素，因此永远不会坐在另一个块的旁边（遵循页面的正常流程）以下列方式之一更改表格的样式应该得到您正在寻找的效果：

float:left;

display:inline-block;

Answer 3

如果您希望第二个表格显示在左侧，请在第一个表格下方删除第二个表格中的valign和align属性。

如果您希望第二个表格显示在标题下方，则在第一个表格的右侧将以下代码添加到第一个表格的style属性float:left;

Answer 4

试试这个..

<table border="1" width="100%">  
  <tr>  
    <td width="20%>  
      Insert table 1 here  
    </td>  
    <td width="80%>  
      Insert table 2 here  
    </td>  
  </tr>  
</table>

如何在html中排列两个表？

4 个答案: