Html 跨引导div span垂直对齐
我在我的应用程序上使用引导,很难使用引导垂直对齐某些项目。它由一个引导行和3个带搜索栏、标题和导航链接的span4组成 这是骨架:Html 跨引导div span垂直对齐,html,css,twitter-bootstrap,Html,Css,Twitter Bootstrap,我在我的应用程序上使用引导,很难使用引导垂直对齐某些项目。它由一个引导行和3个带搜索栏、标题和导航链接的span4组成 这是骨架: <div class="row"> <div class="span4"> form code, as generated by rails form_for <div class="span4"> Page title <div class="span4"> pagination l
<div class="row">
<div class="span4">
form code, as generated by rails form_for
<div class="span4">
Page title
<div class="span4">
pagination links, as generated by rails will_paginate
表单代码,由rails表单_为
页面标题
由rails生成的分页链接将分页
这是rails代码:
<div class="row">
<div class="span4">
<%= form_tag mybooks_path, class: "form-search", :method => 'get', :id => "mybooks_search" do %>
<div class="input-append">
<%= text_field_tag :search, params[:search], class: "search-query" %>
<%= submit_tag "Search", :name => nil, class: "btn" %>
</div>
<% end %>
</div>
<div class="span4">
<h2>My book library</h2>
</div>
<div class="span4">
<%= will_paginate @mybooks, class: "pagination pagination-right" %>
</div>
</div>
'获取',:id=>“mybooks\u search”do%>
无,类别:“btn”%>
我的书库
下面是JSFIDLE:
我使用的是标准的非标准化引导程序2,我需要搜索框、页面标题和分页链接彼此垂直对齐。我不熟悉ruby语法,但从概念上讲,这应该没有什么区别。它们没有对齐的原因是引导程序对不同的元素有自己的默认css。您只需要通过覆盖这些引导样式来微调每个元素。 应用以下样式:
.form-search {
margin: 15px 0 0 0;
}
.pagination {
margin: 15px 0;
}