在div内部浮动一个跨度底部

Question

可能重复:
如何让div浮动到其容器的底部？

我有这个代码将div浮动到div的右下方.但跨度停留在左上角.

<div id="color_tile" class="select_tile" title="Choose color" style="background: grey; background-image: url(wallpaper/201_color_picker.jpg);" >    
  <span id="color_picker" style="visibility: visible; display: block; float: right; vertical-align: bottom;"></span>
</div>

是否有不同的方式来放置跨度？

Answer 1

您可能应该正确地将HTML/CSS彼此分开.

你的代码可能看起来像这样

HTML:

<div>
    <span>Absolute right bottom aligned to div...</span>
</div>

CSS:

div { position: relative; }
div > span { position: absolute; right: 0; bottom: 0; }

显然你的div应该有一些超过跨度的高度/宽度,但通常这是一种非常可接受的方式.

这并不会使div的内容围绕跨度"流动",但是没有明确指出.如上所述,你所拥有的应该在那种情况下工作,如果没有,那就在你的代码的其余部分.

Answer 2

vartical-align 的工作非常特殊（这就是为什么我几乎从不使用它）

在跨度上： position:absolute; bottom:0; right:0;

并在父 div 上设置高度/宽度，然后就完成了