1

我正在尝试在其容器的不同侧面制作两个元素。在我的实际代码中，这两个元素将位于 div 的两侧，但为了举例，假设我希望它们位于浏览器窗口的两侧。

所以我做了一个简单的：

<html>
<head>
</head>
<body>
<table>
<tr>
<td style="width: 50%;text-align: left;">
This should go left
</td>
<td style="width: 50%;text-align: right;">
This should go right
</td>
</tr>
</table>
</body>
</html>

示例在：http: //jsbin.com/ocete/

好吧，我不完全确定如何用 div 很好地做到这一点。同样在右对齐的表格单元格中，我的实际代码中将有两个元素。一个是图像，一个是文本。我希望它们<td>位于它们所在区域的相对两侧。

我怎样才能以我想要的方式做到这一点？我没有看到任何直接的方式。（请不要推荐固定定位）

4

6 回答 6

13

在您的<table>元素中，添加：

style="width: 100%"

一切正常，只是你的桌子不够大，看不到它。

于 2009-12-10T15:48:45.973 回答
4

如果您希望将图像与文本并排放置在表格的不同侧面，您可以使用以下内容：

<table style="width: 100%">
<tr>
<td style="text-alight: left;">
text
</td>
<td style="text-align: right;">
  <table style="width: 100%">
    <tr>
      <td style="text-align: left;">image</td>
      <td style="text-align: right;">text</td>
    </tr>
  </table>
</td>
</tr>
</table>

那应该让你得到类似的东西

-----------------------------
|text    |image    |    text|
-----------------------------
于 2009-12-10T15:51:49.520 回答
1

您没有为表格指定宽度，因此它只是需要的宽度，因此您看不到文本对齐有什么不同。

试试这个

<table style="width: 100%">

再看看。

于 2009-12-10T15:49:06.653 回答
0

有什么理由使用表格进行布局？改用两个divs，将它们的宽度分别设置为 50%，然后将第二个浮动div到右侧。

于 2009-12-10T15:50:43.147 回答
0

为您的表格添加宽度..

<table style="width: 100%">

编辑：太慢了

于 2009-12-10T15:50:52.783 回答
0

你总是要使用一张桌子吗？如果是这样，上述答案将起作用。但是，如果您在一个容器 div 中使用两个 div，则需要将内部 div 分别向左和向右浮动，然后清除容器 div 中的浮动。

于 2009-12-10T15:52:33.033 回答