我正在使用 Twitter Bootstrap's media object在各种社交网络上为我们的用户个人资料设计样式。非常标准的布局:左侧的头像/ Logo ，右侧的标题和简短描述(抱歉，没有足够的代表提供图像，但请参阅下面的 jsfiddle)。
卡住的地方:我需要在媒体标题旁边添加一个“关注”按钮，但我不知道如何正确定位它以处理较长的媒体标题(按钮换行到媒体主体)。
怀疑我正走向一个面面相觑的时刻。
这是一个 jsfiddle说明这两种情况。
这是我的 HTML:
<div class="row">
<div class="span8 media top-buffer">
<div class="row">
<p class="media-object pull-left span2">
<img class="img-polaroid" src="160x120.jpg">
</p>
<div class="media-body span6">
<h3 class="media-heading">Some Name<i class="icon-circle addToFoo-yes-org"></i> <button class="addToFoo-org btn btn-flat pull-right"><i class="icon-plus-sign"></i> Add to My Foo</button><br />
</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
</div>
</div>
</div>
请注意，这是针对原型(prototype)的，我坚定地属于 n00b 类别，所以请原谅我的简陋标记(尤其是对 i 元素的过分使用)。
最佳答案
将 clearfix 类添加到 h3.media-heading。
<h3 class="media-heading clearfix">
关于css - Bootstrap Media Object - 当媒体标题很长时修复 float 按钮换行，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16205855/