Question

我在我的rails应用程序中使用zurb foundation css。我无法在表单中居中提交按钮。按钮始终位于左侧。

<%= form_for @campaign do |f| %>
    <div class="field">
      <%= f.label :name %>
      <%= f.text_field :name %>
    </div>

    <div class="field">
      <%= f.label :content %>
      <%= f.text_area :content %>
    </div>

    <%= f.submit :class => "button radius success text-center", :value => "Create" %>
<% end %>

我必须要有一个简单的课程。

Answer 1

要使按钮居中，您需要将其包含在text-center类的元素中。这就是如何使用text-align属性的CSS中心元素 - 它将使内联和内联块子元素居中。但不是自己。

<link href="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/css/foundation.min.css" rel="stylesheet"/>
<form>
    <div class="field">
      <label>Name</label>
      <input type="text">
    </div>

    <div class="field">
      <label>Name</label>
      <textarea></textarea>
    </div>

    <div class="text-center">
      <input type="submit" class="button radius success" value="Create">
    </div>
</form>

使用zurb基础css以轨道形式居中按钮

1 个答案: