Html 引导布局中的浮动div

我需要用Boostrap做类似的事情。页面上有两个小部件的“流体”内容-第一个在右上角，第二个在左下角

Widget1很简单-我只需要class=“向右拉”。但是，如何处理第二个，使其在页面底部保持“内容”浮动

style=“bottom:0；”

不起作用： 有这个代码吗

... 小部件1。。。
... 小工具2。。。
.... 很多内容。。。。

因此，我认为：

向下移动小部件2也无济于事：

<div class="container-fluid">
  <div class="row-fluid">
    <div class="offset1 span8 pull-right">
      ... Widget 1...
    </div>
      .... a lot of content ....
   <div class="span8 pull-left" style="bottom:0;margin-left: 0;">
      ... Widget 2...
   </div>
  </div>
</div><!--/.fluid-container-->

... 小部件1。。。
.... 很多内容。。。。
... 小工具2。。。

有没有办法在没有恶意攻击的情况下做到这一点（例如，我可以使用JavaScript修复Widget2位置）

---

或者（好的，好的）使用它们？

从我所读到的所有内容来看，如果没有javascript，您就不能完全做您想要做的事情。 如果在文本之前向左浮动

<div style="float:left;">widget</div> here is some CONTENT, etc.

---

我知道您希望Widget2与contents div共享底部边框。请尝试添加

style="position: relative; bottom: 0px"

到您的Widget2标签。还可以尝试：

style="position: absolute; bottom: 0px"

如果您想将小部件捕捉到屏幕底部

---

我对CSS有点生疏，也许正确的样式是“marginbottom:0px”而不是“bottom:0px”，试试吧。此外，pull right类似乎向元素添加了“float=right”样式，我不确定“position:relative”和“position:absolute”的行为如何，我将删除它。

为什么bottom:0不起作用？父母是否处于相对位置？@danwellman-不，不是。我在问题中添加了实际代码。要定位子元素，需要定位父元素。将父对象设置为position:relative，将子对象设置为position:absolute，则bottom:0将起作用—我只需查看boostrap css，一半的问题是他们过度使用float:left，即带有span的anthing具有float:left。谢谢，但它不起作用：。您可以看到，widgetMine右侧的内容没有流动，在我发布的JSFIDLE示例中效果很好。您需要向我展示一个无法修复的示例。好的，我做了一些测试，它决定如何将文本包装到右下角并不总是直观的。看起来，如果最后一行文本与widget2右侧的宽度相匹配，它会将其放在那里，否则它会将最后一行内容保留在widget2上方。我将用信息更新解决方案。

here is some CONTENT, etc. <div style="float:left;">widget</div><div style="clear:both;"></div>

  <div class="container-fluid">
  <div class="row-fluid">
    <div class="offset1 span8 pull-right">
    ... Widget 1...
    </div>
    .... a lot of content ....
    <div class="span8" style="margin-left: 0;">
    ... Widget 2...
    </div>


  </div>

</div><!--/.fluid-container-->

style="position: relative; bottom: 0px"

style="position: absolute; bottom: 0px"