将表格上方的按钮放在桌子右侧

bru*_*ais 2 html css layout

如何将按钮放在与右边对齐的桌子上方?

想象一下放置在桌子右侧的假想垂直线.我希望按钮的右边界限放在那条线的位置.这是一个草案:

示例ilustrated http://i53.tinypic.com/2mhwgzr.png 正如您所看到的,该按钮与表格相关,并且不属于该表格.
该表的大小设置为auto.
我已经尝试使用div作为包装,但这不起作用.任何替代品?

添加:我忘了:桌子应该对齐左边.

kap*_*apa 6

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

display: inline-block; 
text-align: right;
Run Code Online (Sandbox Code Playgroud)

jsFiddle演示

  • 我的解决方案假设按钮不是block,在这种情况下你也必须浮动它(text-align不会影响它).

  • display: inline-block;不会在IE7上运行,但有一个黑客.

小解释:

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