Question

我有一个跨度，我希望正确调整，以便它锚定到基础表的边缘。我已经尝试将这两个元素封装在一个div中，但我想不出让div自动缩小到与桌子大小相同的好方法，同时正确浮动跨度。想法？

我已尝试使用style="display: inline-block; float: left;"但是当span元素为float: right时，这不起作用，它会将div扩展得太多。

在兼容模式下使用的浏览器是IE7和IE8。

Answer 1

尝试：

<div class="wrapper">
<table>
...
</table>
<span class="caption">Here is a caption</span>
</div>

使用：

div.wrapper { overflow: hidden; }
span.caption { float: right; }

溢出部分很重要。

从技术上讲，您可以使用<caption>的{{1}}子元素，但不能在IE6-7上使用CSS（右下角）设置此样式。

Answer 2

解决方案可能取决于您使用<span>的内容。 <span>浮动有多重要？

这有帮助吗？

<style type="text/css">
div.wrapper { float: left; text-align: right;}
span.caption { background-color: #9c9;}
</style>

和

<div class="wrapper">
 <span class="caption">caption</span>
 <table border="2">
  <tr><td>column 1</td><td>column 2</td></tr>
 </table>
 <span class="caption">caption</span>
</div>

确保并且clear包装后的任何内容。

HTML：将元素锚定在元素的右侧

2 个答案: