twitter-bootstrap 将 Bootstrap 内容与缩略图中的图像右侧对齐
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14085980/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Align Bootstrap content to the right of an image within a thumbnail
提问by Richlewis
I am having trouble aligning my caption to the right of my image within a bootstrap thumbnail
我无法在引导程序缩略图中将我的标题与我的图像右侧对齐
My HTML
我的 HTML
<div class="container">
<div class="row">
<div class="span8 offset2">
<% @response.each do |f| %>
<% f.each_pair do |k, v| %>
<h3 class="smallTitle">Available on <%= k %></h2>
<% v.each do |film| %>
<div class="thumbnail">
<img src="http://placehold.it/180x200">
<div class="caption">
<%= link_to film[1], film[0] %> : <%= link_to "remind me", "#", :class => 'remind' %>
</div>
</div>
<% end %>
<% end %>
<% end %>
</div>
</div><!--Row-->
</div><!--/container-->
So at the moment my image is to the left and the caption is below the image.. Is there a simple way with css to get the caption to div to sit to the right of the image
所以目前我的图像在左侧,标题在图像下方.. 有没有一种简单的 css 方法可以让 div 的标题位于图像的右侧
回答by Brian
You could just float the image and caption within the thumbnail div
您可以在缩略图 div 中浮动图像和标题
<div class="thumbnail clearfix">
<img src="http://placehold.it/180x200" class="pull-left">
<div class="caption" class="pull-right">
<%= link_to film[1], film[0] %> : <%= link_to "remind me", "#", :class => 'remind' %>
</div>
</div>

