我曾多次使用float:右(或左)将图像和嵌入框浮动在容器顶部。现在，我需要浮动一个div到另一个div的右下角与正常的文本包装，你得到的浮动(文本包装上面和左边只有)。
我认为这一定是相对容易的，即使浮动没有底部值，但我还没有能够做到这一点使用一些技术和搜索网络还没有出现任何其他使用绝对定位，但这并没有给出正确的换行行为。
我原以为这是一种很常见的设计，但显然不是。如果没有人有建议，我将不得不把我的文本分解成单独的盒子，并手动对齐div，但这是相当不稳定的，我不想在每个需要它的页面上都这样做。
当前回答
我只需要做一个表格。
<div class="elastic">
<div class="elastic_col valign-bottom">
bottom-aligned content.
</div>
</div>
而CSS:
.elastic {
display: table;
}
.elastic_col {
display: table-cell;
}
.valign-bottom {
vertical-align: bottom;
}
看看它的实际应用: http://jsfiddle.net/mLphM/1/
其他回答
我已经在JQuery中实现了这一点，通过将一个零宽度的支柱元素放在浮动的右边，然后根据父高度减去浮动的子高度调整支柱(或管道)的大小。
在js开始之前，我使用的是绝对位置的方法，它可以工作，但允许文本流在后面。因此，我切换到静态位置以启用支柱方法。 (header是父元素，cutout是我想要的右下角，pipe是我的strut)
$("header .pipe").each(function(){
$(this).next(".cutout").css("position","static");
$(this).height($(this).parent().height()-$(this).next(".cutout").height());
});
CSS
header{
position: relative;
}
header img.cutout{
float:right;
position:absolute;
bottom:0;
right:0;
clear:right
}
header .pipe{
width:0px;
float:right
}
管道必须排在第一位，然后是切口，然后是HTML中的文本。
我尝试了其中的几种方法，下面的方法对我来说很有效，所以如果其他方法都失败了，那就试试这个吧，因为它对我很有效。
<style>
#footer {
height:30px;
margin: 0;
clear: both;
width:100%;
position: relative;
bottom:-10;
}
</style>
<div id="footer" >Sportkin - the registry for sport</div>
A选择了@dave-kok这种方式。但只有当整个内容都适合而不需要滚动时，它才会起作用。如果有人能改进我将不胜感激
outer {
position: absolute;
bottom: 0;
width: 100%;
height: 100%;
}
.space {
float: right;
height: 75%;
}
.floateable {
width: 40%;
height: 25%;
float: right;
clear: right;
}
下面是代码http://jsfiddle.net/d9t9joh2/
您可以尝试使用宽度为1px的空元素并将其浮动。然后清除您实际想要定位的元素，并使用空元素的高度来控制它向下移动的距离。
http://codepen.io/cssgrid/pen/KNYrey/
.invisible {
float: left;
}
.bottom {
float: left;
padding-right: 35px;
padding-top: 30px;
clear: left;
}
以下是我的解决方案:
<style>
.sidebar-left{float:left;width:200px}
.content-right{float:right;width:700px}
.footer{clear:both;position:relative;height:1px;width:900px}
.bottom-element{position:absolute;top:-200px;left:0;height:200px;}
</style>
<div class="sidebar-left"> <p>content...</p></div>
<div class="content-right"> <p>content content content content...</p></div>
<div class="footer">
<div class="bottom-element">bottom-element-in-sidebar</div>
</div>
