如何将按钮放置在右对齐的表格上方?

想象一下放置在表格右侧的假想垂直线。我希望将按钮的右侧限制放置在该行所在的位置。这是一个草稿:

可以看到,按钮与表格对齐,不属于表格。该表的大小设置为自动。我已经尝试使用 div 作为包装器,但这没有用。任何替代方案?

添加:我忘记了:表格应该向左对齐。

最佳答案

只需使用以下 CSS 在两者周围添加一个 div 包装器:

display: inline-block;
text-align: right;

jsFiddle Demo
  • 我的解决方案假定按钮不是 block ,在这种情况下,您还必须 float 它( text-align 那时不会影响它)。
  • display: inline-block; 不适用于 IE7,但 there is a hack

  • 小解释:
    display: inline-block; 是这个解决方案的核心。它使容器占据其子项的宽度,在这种情况下可能是 table (但如果按钮更大则没有问题)。

    关于html - 将按钮放在表格上方并与表格右侧对齐,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/6609058/

    10-11 22:41
    查看更多