javascript - 如何将我的搜索框与中心对齐？

Question

我试图将我的搜索框像上面的链接一样放在中心，但添加 :align=> "center" 显然是错误的......这就是我所拥有的......

<h2 align="center"><%= link_to "List by Topic", topics_path %></h2>
<h2 align="center"><%= link_to "List by Organisation", hospitals_path %></h2>
<h2 align="center"><%= link_to "List by Country", countries_path %></h2>
<h2 align="center"><%= link_to "List by Specialty", specialties_path %></h2>

<%= form_tag guidelines_path, :class => 'navbar-search',:onSubmit=>"clearText(this)",:method => :get do %>
   <%= text_field_tag :search, params[:search], :class => 'search-query input-medium', :placeholder=>"Search", :ONFOCUS=>"clearDefault(this)" %>
<% end %>

Answer 1

我不建议使用"align"属性，因为 HTML 标准已弃用这些属性 - 而是考虑使用 CSS 来对齐文本。

话虽如此，如果您将text-align: center;属性放在父元素上，它应该对齐所有非全宽的子元素并接受对齐。

编辑

这是我用来“匹配”的 CSS（假设我匹配了你所拥有的，因为我看不到你的结果）。

h2 {
    text-align: center;
}

.search-wrapper {
    text-align: center;
}

form.navbar-search {
    float: none;
}

你可以在这里检查小提琴：http: //jsfiddle.net/Cx2rV/