0

我创建了几个表。现在我需要两张桌子彼此相邻，而不是一张桌子在彼此之上。如何将第二张桌子放置在第一张桌子旁边（右侧）但中间有足够的空间？

这是我的第二张表的一些代码：

<table>
<h3>Personaldaten</h3>
<tr>
    <td>Externe Referenz:</td>
    <td colspan="2">
       <input class="LargeText" type="text" style="width: 150%">
    </td>
</tr>

<tr>
    <td>Titel:</td>
    <td colspan="2">
        <input class="LargeText" type="text" style="width: 150%">
    </td>
</tr>

上面是第一个表中的 2 个实体，我该如何进行？

4

7 回答 7

1

尝试在表格周围使用包装器并使用 float:left;

//margin: top right bottom left
<div style="width:500px; margin: 30px 0px 0px 320px">
    <table style="width:240px; float:left; margin-right:20px;">
    </table>
    <table style="width:240px; float:left;">
    </table>
</div>
于 2012-07-09T10:47:57.693 回答
0

如果您真的不需要它并使用 CSS 之类的，请摆脱您的绝对定位

table{
float:left;
margin:0px 5px;
}
于 2012-07-09T10:46:58.937 回答
0

你真的有两个选择。

如果您对使用表格创建布局感到满意，请将您的两个表格放在另一个表格中。IE

<table>
  <tr>
    <td>
      <table>{ table 1 stuff }</table>
    </td>
    <td>
      <table>{table 2 stuff }</table>
    </td>
  </tr>
</table>

或者你可以开始研究'浮动'你的元素。

于 2012-07-09T10:47:33.800 回答
0

您可以创建一个具有 1 行和 2 列的新表，并将第一个表放在第一列中，将第二个表放在第二列中。这样两个表可以并排显示

于 2012-07-09T10:48:20.430 回答
0

如果是我，我会将您的表格围绕在一个div图层中，指定图层的宽度和高度div以强制表格彼此相邻。

例如：

<div id="tablecontainer">
<table id="lefttable"></table>
<table id="righttable"></table>
</div>

在 CSS 中：

table
{
margin: 5px;
}

#lefttable
{
float: left;
}

显然，这段代码不会完全是 OP 想要的，但你明白了。

于 2012-07-09T10:50:02.940 回答
0

使用float: left或display: inline-block。

#1：

table {
    margin: 10px;
    float: left
}

#2：

table {
    margin: 10px;
    display: inline-block
}

参见http://shaquin.tk/experiments/tables2.html和http://shaquin.tk/experiments/tables3.html。

于 2012-07-09T10:54:02.260 回答
0

首先，修复语法和样式。table元素不能有子元素h3。要么把h3里面的一个单元格（里面是 a tr），或者把它变成 a caption。不要将宽度设置为 150%，因为这会使单元格占据可用空间宽度的 150%。输入字段集的宽度最好以字符为单位，使用sizeHTML 中的属性。

然后，您可以按照其他答案中的建议或使用align=leftintable标签来浮动 CSS 中的表格。要在表格之间创建水平间距，您可以margin-right在第一张表格上进行设置。

请注意，为了可用性和可访问性，通常应该呈现表单，以便在一行上有一个带有其标签的输入项，以便以简单的方式垂直填写表单。所以你可能正在解决错误的问题。

于 2012-07-09T12:57:29.713 回答