Html <td> 中的 DIV 向右浮动
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17955366/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
DIV in <td> float right
提问by Swag
I got a table with a couple <td>:
我有一张桌子和一对夫妇<td>：
<table>
<tr>
<td>First</td>
<td>Second</td>
<td style="padding:20px;">
<div>
Third
</div>
</td>
</tr>
</table>
What I want to do is to place the "Third" <td>(with the div) to the right side of the table and the "First" and "Second" <td>should stay left.
我想要做的是将“第三个” <td>（带有 div）放在桌子的右侧，而“第一”和“第二”<td>应该留在左边。
Style with float:right;didn't work for me...
风格与float:right;不适合我...
回答by Tim Wasson
You need to make your table's width 100%, then control the widths of your first 2 columns, and finally right-align your third column.
您需要将表格的宽度设为 100%，然后控制前两列的宽度，最后将第三列右对齐。
<table>
<tr>
<td class="first">First</td>
<td class="second">Second</td>
<td class="third">Third</td>
</tr>
</table>
CSS:
CSS：
table { width:100%; }
.first, .second { width:50px; }
.third { text-align:right; }
回答by adrift
The problem is that the width of a <table>is determined by its content, by default. If you want the <table>to span 100% width (of its containing block) like block-level elements do, you can either add table-layout: fixed;and then specify your width - or just give it a width, depending on what you're after, e.g.
问题是<table>默认情况下a 的宽度由其内容决定。如果您希望<table>像块级元素那样跨越 100% 宽度（其包含块的），您可以添加table-layout: fixed;然后指定您的宽度 - 或者只是给它一个宽度，这取决于您所追求的内容，例如
table {
width: 100%;
}
回答by adrift
try add style="text-align:right;"
尝试添加 style="text-align:right;"
<table>
<tr>
<td>First</td>
<td>Second</td>
<td style="padding:20px; text-align:right;">
<div>
Third
</div>
</td>
</tr>
</table>
Only if you have 2 divs one near other:
仅当您有 2 个 div，一个靠近另一个时：
<div id="fr">div1</div>
<div id="fr">div2</div>
you can float them right:
你可以正确地浮动它们：
<style>
#fr{float:right;}
</style>
回答by adrift
<table style="width: 100%;">
<tr>
<td>First</td>
<td>Second</td>
<td style="padding:20px; display: block; float: right;">
<div>
Third
</div>
</td>
</tr>
</table>
I believe this does what you want, however from what I understand, floating table elements will cause problems in versions of Internet Explorer <8
我相信这可以满足您的要求，但是据我了解，浮动表格元素会在 Internet Explorer <8 版本中引起问题
回答by designtocode
I dont know what you are trying to do with tables and divs? But I normally use this for emailers.
我不知道你想用表格和 div 做什么？但我通常将它用于电子邮件发送者。
I use the align attribute for td's. This helps a lot in making sure your layout looks the way you want. And it works in all browsers :)
我对 td 使用 align 属性。这有助于确保您的布局看起来像您想要的那样。它适用于所有浏览器:)
HTML:
HTML：
<table width="100%">
<tr>
<td>First</td>
<td>Second</td>
<td style="padding:20px;" align="right">
<div>
Third
</div>
</td>
</tr>
</table>
