<td>中的DIV向右浮动

Question

我有几张桌子<td>:

<table>
 <tr>
  <td>First</td>
  <td>Second</td>
  <td style="padding:20px;">
      <div>
        Third
      </div>
  </td>
 </tr>
</table>

我想要做的是将"Third" <td>(带有div)放在桌子的右侧,"First"和"Second" <td>应该保持不变.

风格float:right;对我不起作用......

Answer 1

您需要使表格的宽度为100%,然后控制前2列的宽度,最后右对齐第3列.

<table>
 <tr>
  <td class="first">First</td>
  <td class="second">Second</td>
  <td class="third">Third</td>
 </tr>
</table>

CSS:

table { width:100%; }
.first, .second { width:50px; }
.third { text-align:right; }

Answer 2

问题是a的宽度<table>默认由其内容决定.如果你想要<table>像块级元素一样跨越100%宽度(其包含块),你可以添加table-layout: fixed;然后指定你的宽度 - 或者只是给它一个宽度,这取决于你所追求的,例如

table {
   width: 100%;
}