nổi đáy khoảng ngay bên trong một div

Question

thể trùng lặp:
How do I get a div to float to the bottom of its container?

tôi có mã này nổi một div để phía dưới cùng bên phải của một div. Nhưng nhịp bị kẹt ở phía trên bên trái.

<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> 

Có cách nào khác để đặt khoảng không?

Answer 1

vartical-align là rất cụ thể để có được để làm việc (đó là lý do tôi gần như không bao giờ sử dụng nó)

Trên gian tồn tại: position:absolute; bottom:0; right:0;

và đặt một chiều cao/chiều rộng trên div cha mẹ và bạn sẽ là tất cả các thiết lập

Answer 2

Bạn có thể tách HTML/CSS của bạn một cách chính xác.

Mã của bạn có thể giống như thế này

HTML:

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

CSS:

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

Rõ ràng div của bạn nên có một số chiều cao/chiều rộng mà vượt trội so với nhịp, nhưng nói chung đây là một cách rất có thể chấp nhận được.

Điều này không làm cho nội dung của luồng 'div' xung quanh khoảng nhưng không được chỉ định rõ ràng. Như đã nói, những gì bạn có ở đó sẽ hoạt động trong trường hợp đó và nếu nó không nằm trong phần còn lại của mã của bạn.